Compare commits
8 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| dee3f6a132 | |||
| 324eec0cdd | |||
| 3d8bd5e292 | |||
| c473a5e80a | |||
| 645503119b | |||
| 804ef8cec6 | |||
| 85954be93d | |||
| 9a03f37fe3 |
@ -259,74 +259,6 @@
|
||||
"code",
|
||||
"doc"
|
||||
]
|
||||
},
|
||||
{
|
||||
"login": "uchar",
|
||||
"name": "Omid",
|
||||
"avatar_url": "https://avatars.githubusercontent.com/u/5172296?v=4",
|
||||
"profile": "https://www.linkedin.com/in/oes-rioniz/",
|
||||
"contributions": [
|
||||
"test",
|
||||
"code"
|
||||
]
|
||||
},
|
||||
{
|
||||
"login": "kathari00",
|
||||
"name": "Katharina Eiserfey",
|
||||
"avatar_url": "https://avatars.githubusercontent.com/u/42547712?v=4",
|
||||
"profile": "https://github.com/kathari00",
|
||||
"contributions": [
|
||||
"code",
|
||||
"test",
|
||||
"doc"
|
||||
]
|
||||
},
|
||||
{
|
||||
"login": "luca-peruzzo",
|
||||
"name": "Luca Peruzzo",
|
||||
"avatar_url": "https://avatars.githubusercontent.com/u/69015314?v=4",
|
||||
"profile": "https://github.com/luca-peruzzo",
|
||||
"contributions": [
|
||||
"code",
|
||||
"test"
|
||||
]
|
||||
},
|
||||
{
|
||||
"login": "nima70",
|
||||
"name": "Nima Shokouhfar",
|
||||
"avatar_url": "https://avatars.githubusercontent.com/u/5094767?v=4",
|
||||
"profile": "https://github.com/nima70",
|
||||
"contributions": [
|
||||
"code",
|
||||
"test"
|
||||
]
|
||||
},
|
||||
{
|
||||
"login": "marvinruder",
|
||||
"name": "Marvin A. Ruder",
|
||||
"avatar_url": "https://avatars.githubusercontent.com/u/18495294?v=4",
|
||||
"profile": "https://mruder.dev",
|
||||
"contributions": [
|
||||
"bug"
|
||||
]
|
||||
},
|
||||
{
|
||||
"login": "zvn2060",
|
||||
"name": "HI_OuO",
|
||||
"avatar_url": "https://avatars.githubusercontent.com/u/45450852?v=4",
|
||||
"profile": "https://github.com/zvn2060",
|
||||
"contributions": [
|
||||
"code"
|
||||
]
|
||||
},
|
||||
{
|
||||
"login": "tripheo0412",
|
||||
"name": "Tri Hoang",
|
||||
"avatar_url": "https://avatars.githubusercontent.com/u/25382052?v=4",
|
||||
"profile": "https://github.com/tripheo0412",
|
||||
"contributions": [
|
||||
"doc"
|
||||
]
|
||||
}
|
||||
],
|
||||
"contributorsPerLine": 7,
|
||||
|
||||
39
.github/workflows/ci.yaml
vendored
39
.github/workflows/ci.yaml
vendored
@ -3,6 +3,7 @@ on:
|
||||
push:
|
||||
branches:
|
||||
- main
|
||||
- v10
|
||||
pull_request:
|
||||
branches:
|
||||
- main
|
||||
@ -35,21 +36,21 @@ jobs:
|
||||
- run: npm run build
|
||||
- run: npm run test
|
||||
|
||||
storybook:
|
||||
runs-on: ubuntu-latest
|
||||
if: github.event_name == 'push' && github.ref == 'refs/heads/main'
|
||||
needs: test
|
||||
steps:
|
||||
- uses: actions/checkout@v4
|
||||
- uses: actions/setup-node@v4
|
||||
with:
|
||||
node-version: '18'
|
||||
- uses: bahmutov/npm-install@v1
|
||||
- run: npm run build-storybook
|
||||
- run: git remote set-url origin https://git:${GITHUB_TOKEN}@github.com/${{github.repository}}.git
|
||||
env:
|
||||
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
|
||||
- run: npx -y -p gh-pages@3.1.0 gh-pages -d ./storybook-static -u "github-actions-bot <actions@github.com>"
|
||||
#storybook:
|
||||
# runs-on: ubuntu-latest
|
||||
# if: github.event_name == 'push'
|
||||
# needs: test
|
||||
# steps:
|
||||
# - uses: actions/checkout@v4
|
||||
# - uses: actions/setup-node@v4
|
||||
# with:
|
||||
# node-version: '18'
|
||||
# - uses: bahmutov/npm-install@v1
|
||||
# - run: npm run build-storybook
|
||||
# - run: git remote set-url origin https://git:${GITHUB_TOKEN}@github.com/${{github.repository}}.git
|
||||
# env:
|
||||
# GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
|
||||
# - run: npx -y -p gh-pages@3.1.0 gh-pages -d ./storybook-static -u "github-actions-bot <actions@github.com>"
|
||||
|
||||
check_if_version_upgraded:
|
||||
name: Check if version upgrade
|
||||
@ -95,6 +96,7 @@ jobs:
|
||||
generate_release_notes: true
|
||||
draft: false
|
||||
prerelease: ${{ needs.check_if_version_upgraded.outputs.is_pre_release == 'true' }}
|
||||
make_latest: false
|
||||
env:
|
||||
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
|
||||
|
||||
@ -112,7 +114,7 @@ jobs:
|
||||
registry-url: https://registry.npmjs.org/
|
||||
- uses: bahmutov/npm-install@v1
|
||||
- run: npm run build
|
||||
- run: npx -y -p denoify@1.6.13 enable_short_npm_import_path
|
||||
- run: npx -y -p denoify@1.6.12 enable_short_npm_import_path
|
||||
env:
|
||||
DRY_RUN: "0"
|
||||
- uses: garronej/ts-ci@v2.1.2
|
||||
@ -128,10 +130,7 @@ jobs:
|
||||
echo "Can't publish on NPM, You must first create a secret called NPM_TOKEN that contains your NPM auth token. https://help.github.com/en/actions/automating-your-workflow-with-github-actions/creating-and-using-encrypted-secrets"
|
||||
false
|
||||
fi
|
||||
EXTRA_ARGS=""
|
||||
if [ "$IS_PRE_RELEASE" = "true" ]; then
|
||||
EXTRA_ARGS="--tag next"
|
||||
fi
|
||||
EXTRA_ARGS="--tag keycloakify_v10"
|
||||
npm publish $EXTRA_ARGS
|
||||
env:
|
||||
NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}}
|
||||
|
||||
2
.gitignore
vendored
2
.gitignore
vendored
@ -49,7 +49,7 @@ jspm_packages
|
||||
.idea
|
||||
|
||||
/src/login/i18n/messages_defaultSet/
|
||||
/src/account/i18n/
|
||||
/src/account/i18n/messages_defaultSet/
|
||||
|
||||
# VS Code devcontainers
|
||||
.devcontainer
|
||||
|
||||
@ -1,3 +1,3 @@
|
||||
Looking to contribute? Thank you! PR are more than welcome.
|
||||
|
||||
Please refers to [this documentation page](https://docs.keycloakify.dev/faq-and-help/contributing) that will help you get started.
|
||||
Please refers to [this documentation page](https://docs.keycloakify.dev/contributing) that will help you get started.
|
||||
|
||||
46
README.md
46
README.md
@ -41,50 +41,23 @@
|
||||
<img width="400" src="https://github.com/user-attachments/assets/6bf3bef9-00b0-4460-97b9-0d2da8500798">
|
||||
</p>
|
||||
|
||||
Keycloakify is fully compatible with Keycloak from version 11 to 26...[and beyond](https://github.com/keycloakify/keycloakify/discussions/346#discussioncomment-5889791)
|
||||
|
||||
> 📣 **Keycloakify 26 Released**
|
||||
> Themes built with Keycloakify versions **prior** to Keycloak 26 are **incompatible** with Keycloak 26.
|
||||
> To ensure compatibility, simply upgrade to the latest Keycloakify version for your major release (v10 or v11) and rebuild your theme.
|
||||
> No breaking changes have been introduced, but the target version ranges have been updated. For more details, see [this guide](https://docs.keycloakify.dev/targeting-specific-keycloak-versions).
|
||||
Keycloakify is fully compatible with Keycloak from version 11 to 25...[and beyond](https://github.com/keycloakify/keycloakify/discussions/346#discussioncomment-5889791)
|
||||
|
||||
## Sponsors
|
||||
|
||||
Project backers, we trust and recommend their services.
|
||||
Friends for the project, we trust and recommend their services.
|
||||
|
||||
<br/>
|
||||
|
||||
<div align="center">
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div align="center">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<br/>
|
||||
|
||||
<p align="center">
|
||||
<i><a href="https://phasetwo.io/?utm_source=keycloakify"><strong>Keycloak as a Service</strong></a> - Keycloak community contributors of popular <a href="https://github.com/p2-inc#our-extensions-?utm_source=keycloakify">extensions</a> providing free and dedicated <a href="https://phasetwo.io/hosting/?utm_source=keycloakify">Keycloak hosting</a> and enterprise <a href="https://phasetwo.io/support/?utm_source=keycloakify">Keycloak support</a> to businesses of all sizes.</i>
|
||||
</p>
|
||||
|
||||
<br/>
|
||||
<br/>
|
||||
<br/>
|
||||
|
||||
<div align="center">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div align="center">
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
@ -109,7 +82,7 @@ Project backers, we trust and recommend their services.
|
||||
</div>
|
||||
|
||||
<p align="center">
|
||||
<a href="https://cloud-iam.com/?mtm_campaign=keycloakify-deal&mtm_source=keycloakify-github"><strong>Managed Keycloak Provider</strong> - With Cloud-IAM powering your Keycloak clusters, you can sleep easy knowing you've got the software and the experts you need for operational excellence. Cloud IAM is a french company. </a>
|
||||
<a href="https://cloud-iam.com/?mtm_campaign=keycloakify-deal&mtm_source=keycloakify-github"><strong>Managed Keycloak Provider</strong> - With Cloud-IAM powering your Keycloak clusters, you can sleep easy knowing you've got the software and the experts you need for operational excellence. </a>
|
||||
<br/>
|
||||
Use code <code>keycloakify5</code> at checkout for a 5% discount.
|
||||
</p>
|
||||
@ -159,15 +132,6 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
|
||||
<td align="center" valign="top" width="14.28%"><a href="https://github.com/oliviergoulet5"><img src="https://avatars.githubusercontent.com/u/17685861?v=4?s=100" width="100px;" alt="Olivier Goulet"/><br /><sub><b>Olivier Goulet</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=oliviergoulet5" title="Code">💻</a></td>
|
||||
<td align="center" valign="top" width="14.28%"><a href="https://github.com/liamlows"><img src="https://avatars.githubusercontent.com/u/1365914?v=4?s=100" width="100px;" alt="Liam Lowsley-Williams"/><br /><sub><b>Liam Lowsley-Williams</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=liamlows" title="Code">💻</a> <a href="https://github.com/keycloakify/keycloakify/commits?author=liamlows" title="Documentation">📖</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="center" valign="top" width="14.28%"><a href="https://www.linkedin.com/in/oes-rioniz/"><img src="https://avatars.githubusercontent.com/u/5172296?v=4?s=100" width="100px;" alt="Omid"/><br /><sub><b>Omid</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=uchar" title="Tests">⚠️</a> <a href="https://github.com/keycloakify/keycloakify/commits?author=uchar" title="Code">💻</a></td>
|
||||
<td align="center" valign="top" width="14.28%"><a href="https://github.com/kathari00"><img src="https://avatars.githubusercontent.com/u/42547712?v=4?s=100" width="100px;" alt="Katharina Eiserfey"/><br /><sub><b>Katharina Eiserfey</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=kathari00" title="Code">💻</a> <a href="https://github.com/keycloakify/keycloakify/commits?author=kathari00" title="Tests">⚠️</a> <a href="https://github.com/keycloakify/keycloakify/commits?author=kathari00" title="Documentation">📖</a></td>
|
||||
<td align="center" valign="top" width="14.28%"><a href="https://github.com/luca-peruzzo"><img src="https://avatars.githubusercontent.com/u/69015314?v=4?s=100" width="100px;" alt="Luca Peruzzo"/><br /><sub><b>Luca Peruzzo</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=luca-peruzzo" title="Code">💻</a> <a href="https://github.com/keycloakify/keycloakify/commits?author=luca-peruzzo" title="Tests">⚠️</a></td>
|
||||
<td align="center" valign="top" width="14.28%"><a href="https://github.com/nima70"><img src="https://avatars.githubusercontent.com/u/5094767?v=4?s=100" width="100px;" alt="Nima Shokouhfar"/><br /><sub><b>Nima Shokouhfar</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=nima70" title="Code">💻</a> <a href="https://github.com/keycloakify/keycloakify/commits?author=nima70" title="Tests">⚠️</a></td>
|
||||
<td align="center" valign="top" width="14.28%"><a href="https://mruder.dev"><img src="https://avatars.githubusercontent.com/u/18495294?v=4?s=100" width="100px;" alt="Marvin A. Ruder"/><br /><sub><b>Marvin A. Ruder</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/issues?q=author%3Amarvinruder" title="Bug reports">🐛</a></td>
|
||||
<td align="center" valign="top" width="14.28%"><a href="https://github.com/zvn2060"><img src="https://avatars.githubusercontent.com/u/45450852?v=4?s=100" width="100px;" alt="HI_OuO"/><br /><sub><b>HI_OuO</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=zvn2060" title="Code">💻</a></td>
|
||||
<td align="center" valign="top" width="14.28%"><a href="https://github.com/tripheo0412"><img src="https://avatars.githubusercontent.com/u/25382052?v=4?s=100" width="100px;" alt="Tri Hoang"/><br /><sub><b>Tri Hoang</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=tripheo0412" title="Documentation">📖</a></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
||||
31
package.json
31
package.json
@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "keycloakify",
|
||||
"version": "11.3.26",
|
||||
"description": "Framework to create custom Keycloak UIs",
|
||||
"version": "10.1.6",
|
||||
"description": "Create Keycloak themes using React",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/keycloakify/keycloakify.git"
|
||||
@ -38,14 +38,12 @@
|
||||
"dist/",
|
||||
"!dist/tsconfig.tsbuildinfo",
|
||||
"!dist/bin/",
|
||||
"dist/bin/**/*.d.ts",
|
||||
"dist/bin/main.js",
|
||||
"dist/bin/*.index.js",
|
||||
"dist/bin/*.node",
|
||||
"dist/bin/shared/constants.js",
|
||||
"dist/bin/shared/constants.js.map",
|
||||
"dist/bin/shared/customHandler.js",
|
||||
"dist/bin/shared/customHandler.js.map",
|
||||
"dist/bin/shared/*.d.ts",
|
||||
"dist/bin/shared/*.js.map",
|
||||
"!dist/vite-plugin/",
|
||||
"dist/vite-plugin/index.js",
|
||||
"dist/vite-plugin/index.d.ts",
|
||||
@ -64,13 +62,12 @@
|
||||
],
|
||||
"homepage": "https://www.keycloakify.dev",
|
||||
"dependencies": {
|
||||
"tsafe": "^1.8.5"
|
||||
"tsafe": "^1.6.6"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.24.5",
|
||||
"@babel/generator": "^7.24.5",
|
||||
"@babel/parser": "^7.24.5",
|
||||
"@babel/preset-env": "7.24.8",
|
||||
"@babel/types": "^7.24.5",
|
||||
"@emotion/react": "^11.11.4",
|
||||
"@octokit/rest": "^20.1.1",
|
||||
@ -78,31 +75,24 @@
|
||||
"@storybook/builder-webpack5": "^6.5.13",
|
||||
"@storybook/manager-webpack5": "^6.5.13",
|
||||
"@storybook/react": "^6.5.13",
|
||||
"eslint-plugin-storybook": "^0.6.7",
|
||||
"@types/babel__generator": "^7.6.4",
|
||||
"@types/dompurify": "^2.0.0",
|
||||
"@types/make-fetch-happen": "^10.0.1",
|
||||
"@types/minimist": "^1.2.2",
|
||||
"@types/node": "^18.15.3",
|
||||
"@types/properties-parser": "^0.3.3",
|
||||
"@types/react": "^18.0.35",
|
||||
"@types/react-dom": "^18.0.11",
|
||||
"@types/yauzl": "^2.10.3",
|
||||
"@vercel/ncc": "^0.38.1",
|
||||
"babel-loader": "9.1.3",
|
||||
"chalk": "^4.1.2",
|
||||
"cheerio": "1.0.0-rc.12",
|
||||
"chokidar-cli": "^3.0.0",
|
||||
"cli-select": "^1.1.2",
|
||||
"dompurify": "^3.1.6",
|
||||
"eslint-plugin-storybook": "^0.6.7",
|
||||
"evt": "^2.5.8",
|
||||
"html-entities": "^2.5.2",
|
||||
"husky": "^4.3.8",
|
||||
"isomorphic-dompurify": "^2.15.0",
|
||||
"lint-staged": "^11.0.0",
|
||||
"magic-string": "^0.30.7",
|
||||
"make-fetch-happen": "^11.0.3",
|
||||
"powerhooks": "^1.0.19",
|
||||
"powerhooks": "^1.0.10",
|
||||
"prettier": "^3.2.5",
|
||||
"properties-parser": "^0.3.1",
|
||||
"react": "^18.2.0",
|
||||
@ -113,13 +103,12 @@
|
||||
"termost": "^v0.12.1",
|
||||
"tsc-alias": "^1.8.10",
|
||||
"tss-react": "^4.9.10",
|
||||
"tsx": "^4.15.5",
|
||||
"typescript": "^4.9.4",
|
||||
"vite": "^5.2.11",
|
||||
"vitest": "^1.6.0",
|
||||
"webpack": "5.93.0",
|
||||
"webpack-cli": "5.1.4",
|
||||
"yauzl": "^2.10.0",
|
||||
"zod": "^3.17.10"
|
||||
"zod": "^3.17.10",
|
||||
"evt": "^2.5.7",
|
||||
"tsx": "^4.15.5"
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,4 +1,10 @@
|
||||
import { run } from "./shared/run";
|
||||
import * as child_process from "child_process";
|
||||
|
||||
run("yarn build");
|
||||
run("npx build-storybook");
|
||||
|
||||
function run(command: string, options?: { env?: NodeJS.ProcessEnv }) {
|
||||
console.log(`$ ${command}`);
|
||||
|
||||
child_process.execSync(command, { stdio: "inherit", ...options });
|
||||
}
|
||||
|
||||
@ -1,3 +1,4 @@
|
||||
import * as child_process from "child_process";
|
||||
import * as fs from "fs";
|
||||
import { join } from "path";
|
||||
import { assert } from "tsafe/assert";
|
||||
@ -5,8 +6,6 @@ import { transformCodebase } from "../../src/bin/tools/transformCodebase";
|
||||
import { createPublicKeycloakifyDevResourcesDir } from "./createPublicKeycloakifyDevResourcesDir";
|
||||
import { createAccountV1Dir } from "./createAccountV1Dir";
|
||||
import chalk from "chalk";
|
||||
import { run } from "../shared/run";
|
||||
import { vendorFrontendDependencies } from "./vendorFrontendDependencies";
|
||||
|
||||
(async () => {
|
||||
console.log(chalk.cyan("Building Keycloakify..."));
|
||||
@ -40,9 +39,7 @@ import { vendorFrontendDependencies } from "./vendorFrontendDependencies";
|
||||
);
|
||||
}
|
||||
|
||||
run(
|
||||
`npx ncc build ${join("dist", "bin", "main.js")} --external prettier -o ${join("dist", "ncc_out")}`
|
||||
);
|
||||
run(`npx ncc build ${join("dist", "bin", "main.js")} -o ${join("dist", "ncc_out")}`);
|
||||
|
||||
transformCodebase({
|
||||
srcDirPath: join("dist", "ncc_out"),
|
||||
@ -91,7 +88,6 @@ import { vendorFrontendDependencies } from "./vendorFrontendDependencies";
|
||||
|
||||
run(`npx tsc -p ${join("src", "tsconfig.json")}`);
|
||||
run(`npx tsc-alias -p ${join("src", "tsconfig.json")}`);
|
||||
vendorFrontendDependencies({ distDirPath: join(process.cwd(), "dist") });
|
||||
|
||||
if (fs.existsSync(join("dist", "vite-plugin", "index.original.js"))) {
|
||||
fs.renameSync(
|
||||
@ -115,7 +111,7 @@ import { vendorFrontendDependencies } from "./vendorFrontendDependencies";
|
||||
}
|
||||
|
||||
run(
|
||||
`npx ncc build ${join("dist", "vite-plugin", "index.js")} --external prettier -o ${join(
|
||||
`npx ncc build ${join("dist", "vite-plugin", "index.js")} -o ${join(
|
||||
"dist",
|
||||
"ncc_out"
|
||||
)}`
|
||||
@ -168,6 +164,12 @@ import { vendorFrontendDependencies } from "./vendorFrontendDependencies";
|
||||
);
|
||||
})();
|
||||
|
||||
function run(command: string) {
|
||||
console.log(chalk.grey(`$ ${command}`));
|
||||
|
||||
child_process.execSync(command, { stdio: "inherit" });
|
||||
}
|
||||
|
||||
function patchDeprecatedBufferApiUsage(filePath: string) {
|
||||
const before = fs.readFileSync(filePath).toString("utf8");
|
||||
|
||||
|
||||
@ -1,95 +0,0 @@
|
||||
import * as fs from "fs";
|
||||
import { join as pathJoin, basename as pathBasename, dirname as pathDirname } from "path";
|
||||
import { assert } from "tsafe/assert";
|
||||
import { run } from "../shared/run";
|
||||
import { cacheDirPath as cacheDirPath_base } from "../shared/cacheDirPath";
|
||||
|
||||
export function vendorFrontendDependencies(params: { distDirPath: string }) {
|
||||
const { distDirPath } = params;
|
||||
|
||||
const vendorDirPath = pathJoin(distDirPath, "tools", "vendor");
|
||||
const cacheDirPath = pathJoin(cacheDirPath_base, "vendorFrontendDependencies");
|
||||
|
||||
const extraBundleFileBasenames = new Set<string>();
|
||||
|
||||
fs.readdirSync(vendorDirPath)
|
||||
.filter(fileBasename => fileBasename.endsWith(".js"))
|
||||
.map(fileBasename => pathJoin(vendorDirPath, fileBasename))
|
||||
.forEach(filePath => {
|
||||
{
|
||||
const mapFilePath = `${filePath}.map`;
|
||||
|
||||
if (fs.existsSync(mapFilePath)) {
|
||||
fs.unlinkSync(mapFilePath);
|
||||
}
|
||||
}
|
||||
|
||||
if (!fs.existsSync(cacheDirPath)) {
|
||||
fs.mkdirSync(cacheDirPath, { recursive: true });
|
||||
}
|
||||
|
||||
const webpackConfigJsFilePath = pathJoin(cacheDirPath, "webpack.config.js");
|
||||
const webpackOutputDirPath = pathJoin(cacheDirPath, "webpack_output");
|
||||
const webpackOutputFilePath = pathJoin(webpackOutputDirPath, "index.js");
|
||||
|
||||
fs.writeFileSync(
|
||||
webpackConfigJsFilePath,
|
||||
Buffer.from(
|
||||
[
|
||||
``,
|
||||
`module.exports = {`,
|
||||
` mode: 'production',`,
|
||||
` entry: Buffer.from("${Buffer.from(filePath, "utf8").toString("base64")}", "base64").toString("utf8"),`,
|
||||
` output: {`,
|
||||
` path: Buffer.from("${Buffer.from(webpackOutputDirPath, "utf8").toString("base64")}", "base64").toString("utf8"),`,
|
||||
` filename: '${pathBasename(webpackOutputFilePath)}',`,
|
||||
` libraryTarget: 'module',`,
|
||||
` },`,
|
||||
` target: "web",`,
|
||||
` module: {`,
|
||||
` rules: [`,
|
||||
` {`,
|
||||
` test: /\.js$/,`,
|
||||
` use: {`,
|
||||
` loader: 'babel-loader',`,
|
||||
` options: {`,
|
||||
` presets: ['@babel/preset-env'],`,
|
||||
` }`,
|
||||
` }`,
|
||||
` }`,
|
||||
` ]`,
|
||||
` },`,
|
||||
` experiments: {`,
|
||||
` outputModule: true`,
|
||||
` }`,
|
||||
`};`
|
||||
].join("\n")
|
||||
)
|
||||
);
|
||||
|
||||
run(`npx webpack --config ${webpackConfigJsFilePath}`);
|
||||
|
||||
fs.readdirSync(webpackOutputDirPath)
|
||||
.filter(fileBasename => !fileBasename.endsWith(".txt"))
|
||||
.map(fileBasename => pathJoin(webpackOutputDirPath, fileBasename))
|
||||
.forEach(bundleFilePath => {
|
||||
assert(bundleFilePath.endsWith(".js"));
|
||||
|
||||
if (pathBasename(bundleFilePath) === "index.js") {
|
||||
fs.renameSync(webpackOutputFilePath, filePath);
|
||||
} else {
|
||||
const bundleFileBasename = pathBasename(bundleFilePath);
|
||||
|
||||
assert(!extraBundleFileBasenames.has(bundleFileBasename));
|
||||
extraBundleFileBasenames.add(bundleFileBasename);
|
||||
|
||||
fs.renameSync(
|
||||
bundleFilePath,
|
||||
pathJoin(pathDirname(filePath), bundleFileBasename)
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
fs.rmSync(webpackOutputDirPath, { recursive: true });
|
||||
});
|
||||
}
|
||||
@ -4,8 +4,8 @@ import { SemVer } from "../src/bin/tools/SemVer";
|
||||
import { join as pathJoin, relative as pathRelative } from "path";
|
||||
import chalk from "chalk";
|
||||
import { Deferred } from "evt/tools/Deferred";
|
||||
import { assert, is } from "tsafe/assert";
|
||||
import { run } from "./shared/run";
|
||||
import { assert } from "tsafe/assert";
|
||||
import { is } from "tsafe/is";
|
||||
|
||||
(async () => {
|
||||
{
|
||||
@ -84,3 +84,9 @@ import { run } from "./shared/run";
|
||||
|
||||
console.log(`${chalk.green(`✓ Exported realm to`)} ${chalk.bold(targetFilePath)}`);
|
||||
})();
|
||||
|
||||
function run(command: string) {
|
||||
console.log(chalk.grey(`$ ${command}`));
|
||||
|
||||
return child_process.execSync(command, { stdio: "inherit" });
|
||||
}
|
||||
|
||||
@ -1,3 +1,4 @@
|
||||
import "minimal-polyfills/Object.fromEntries";
|
||||
import * as fs from "fs";
|
||||
import {
|
||||
join as pathJoin,
|
||||
@ -12,8 +13,7 @@ import { downloadKeycloakDefaultTheme } from "./shared/downloadKeycloakDefaultTh
|
||||
import { getThisCodebaseRootDirPath } from "../src/bin/tools/getThisCodebaseRootDirPath";
|
||||
import { deepAssign } from "../src/tools/deepAssign";
|
||||
import { THEME_TYPES } from "../src/bin/shared/constants";
|
||||
import { transformCodebase } from "../src/bin/tools/transformCodebase";
|
||||
import propertiesParser from "properties-parser";
|
||||
const propertiesParser: any = require("properties-parser");
|
||||
|
||||
if (require.main === module) {
|
||||
generateI18nMessages();
|
||||
@ -22,22 +22,11 @@ if (require.main === module) {
|
||||
async function generateI18nMessages() {
|
||||
const thisCodebaseRootDirPath = getThisCodebaseRootDirPath();
|
||||
|
||||
const accountI18nDirPath = pathJoin(
|
||||
thisCodebaseRootDirPath,
|
||||
"src",
|
||||
"account",
|
||||
"i18n"
|
||||
);
|
||||
|
||||
if (fs.existsSync(accountI18nDirPath)) {
|
||||
fs.rmSync(accountI18nDirPath, { recursive: true });
|
||||
}
|
||||
|
||||
type Dictionary = { [idiomId: string]: string };
|
||||
|
||||
const record: { [themeType: string]: { [language: string]: Dictionary } } = {};
|
||||
|
||||
for (const themeType of THEME_TYPES.filter(themeType => themeType !== "admin")) {
|
||||
for (const themeType of THEME_TYPES) {
|
||||
const { extractedDirPath } = await downloadKeycloakDefaultTheme({
|
||||
keycloakVersionId: (() => {
|
||||
switch (themeType) {
|
||||
@ -150,26 +139,6 @@ async function generateI18nMessages() {
|
||||
"messages_defaultSet"
|
||||
);
|
||||
|
||||
if (!fs.existsSync(messagesDirPath)) {
|
||||
fs.mkdirSync(messagesDirPath, { recursive: true });
|
||||
}
|
||||
|
||||
fs.writeFileSync(
|
||||
pathJoin(messagesDirPath, "types.ts"),
|
||||
Buffer.from(
|
||||
[
|
||||
``,
|
||||
`export const languageTags = ${JSON.stringify(languages, null, 2)} as const;`,
|
||||
``,
|
||||
`export type LanguageTag = typeof languageTags[number];`,
|
||||
``,
|
||||
`export type MessageKey = keyof typeof import("./en")["default"];`,
|
||||
``
|
||||
].join("\n"),
|
||||
"utf8"
|
||||
)
|
||||
);
|
||||
|
||||
const generatedFileHeader = [
|
||||
`//This code was automatically generated by running ${pathRelative(
|
||||
thisCodebaseRootDirPath,
|
||||
@ -233,18 +202,6 @@ async function generateI18nMessages() {
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
transformCodebase({
|
||||
srcDirPath: pathJoin(thisCodebaseRootDirPath, "src", "login", "i18n"),
|
||||
destDirPath: accountI18nDirPath,
|
||||
transformSourceCode: ({ fileRelativePath, sourceCode }) => {
|
||||
if (fileRelativePath.startsWith("messages_defaultSet")) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
return { modifiedSourceCode: sourceCode };
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
const keycloakifyExtraMessages_login: Record<
|
||||
|
||||
@ -55,6 +55,7 @@ const commonThirdPartyDeps = [
|
||||
Buffer.from(modifiedPackageJsonContent, "utf8")
|
||||
);
|
||||
}
|
||||
|
||||
const yarnGlobalDirPath = pathJoin(rootDirPath, ".yarn_home");
|
||||
|
||||
fs.rmSync(yarnGlobalDirPath, { recursive: true, force: true });
|
||||
@ -63,21 +64,6 @@ fs.mkdirSync(yarnGlobalDirPath);
|
||||
const execYarnLink = (params: { targetModuleName?: string; cwd: string }) => {
|
||||
const { targetModuleName, cwd } = params;
|
||||
|
||||
if (targetModuleName === undefined) {
|
||||
const packageJsonFilePath = pathJoin(cwd, "package.json");
|
||||
|
||||
const packageJson = JSON.parse(
|
||||
fs.readFileSync(packageJsonFilePath).toString("utf8")
|
||||
);
|
||||
|
||||
delete packageJson["packageManager"];
|
||||
|
||||
fs.writeFileSync(
|
||||
packageJsonFilePath,
|
||||
Buffer.from(JSON.stringify(packageJson, null, 2))
|
||||
);
|
||||
}
|
||||
|
||||
const cmd = [
|
||||
"yarn",
|
||||
"link",
|
||||
@ -91,10 +77,7 @@ const execYarnLink = (params: { targetModuleName?: string; cwd: string }) => {
|
||||
env: {
|
||||
...process.env,
|
||||
...(os.platform() === "win32"
|
||||
? {
|
||||
USERPROFILE: yarnGlobalDirPath,
|
||||
LOCALAPPDATA: yarnGlobalDirPath
|
||||
}
|
||||
? { USERPROFILE: yarnGlobalDirPath }
|
||||
: { HOME: yarnGlobalDirPath })
|
||||
}
|
||||
});
|
||||
@ -125,54 +108,7 @@ if (testAppPaths.length === 0) {
|
||||
process.exit(-1);
|
||||
}
|
||||
|
||||
testAppPaths.forEach(testAppPath => {
|
||||
const packageJsonFilePath = pathJoin(testAppPath, "package.json");
|
||||
|
||||
const packageJsonContent = fs.readFileSync(packageJsonFilePath);
|
||||
|
||||
const parsedPackageJson = JSON.parse(packageJsonContent.toString("utf8")) as {
|
||||
scripts?: Record<string, string>;
|
||||
};
|
||||
|
||||
let hasPostInstallOrPrepareScript = false;
|
||||
|
||||
if (parsedPackageJson.scripts !== undefined) {
|
||||
for (const scriptName of ["postinstall", "prepare"]) {
|
||||
if (parsedPackageJson.scripts[scriptName] === undefined) {
|
||||
continue;
|
||||
}
|
||||
|
||||
hasPostInstallOrPrepareScript = true;
|
||||
|
||||
delete parsedPackageJson.scripts[scriptName];
|
||||
}
|
||||
}
|
||||
|
||||
if (hasPostInstallOrPrepareScript) {
|
||||
fs.writeFileSync(
|
||||
packageJsonFilePath,
|
||||
Buffer.from(JSON.stringify(parsedPackageJson, null, 2), "utf8")
|
||||
);
|
||||
}
|
||||
|
||||
const restorePackageJson = () => {
|
||||
if (!hasPostInstallOrPrepareScript) {
|
||||
return;
|
||||
}
|
||||
|
||||
fs.writeFileSync(packageJsonFilePath, packageJsonContent);
|
||||
};
|
||||
|
||||
try {
|
||||
execSync("yarn install", { cwd: testAppPath });
|
||||
} catch (error) {
|
||||
restorePackageJson();
|
||||
|
||||
throw error;
|
||||
}
|
||||
|
||||
restorePackageJson();
|
||||
});
|
||||
testAppPaths.forEach(testAppPath => execSync("yarn install", { cwd: testAppPath }));
|
||||
|
||||
console.log("=== Linking common dependencies ===");
|
||||
|
||||
@ -219,20 +155,4 @@ testAppPaths.forEach(testAppPath =>
|
||||
})
|
||||
);
|
||||
|
||||
testAppPaths.forEach(testAppPath => {
|
||||
const { scripts = {} } = JSON.parse(
|
||||
fs.readFileSync(pathJoin(testAppPath, "package.json")).toString("utf8")
|
||||
) as {
|
||||
scripts?: Record<string, string>;
|
||||
};
|
||||
|
||||
for (const scriptName of ["postinstall", "prepare"]) {
|
||||
if (scripts[scriptName] === undefined) {
|
||||
continue;
|
||||
}
|
||||
|
||||
execSync(`yarn run ${scriptName}`, { cwd: testAppPath });
|
||||
}
|
||||
});
|
||||
|
||||
export {};
|
||||
|
||||
@ -1,88 +1,55 @@
|
||||
import * as child_process from "child_process";
|
||||
import * as fs from "fs";
|
||||
import { join as pathJoin, sep as pathSep } from "path";
|
||||
import { run } from "./shared/run";
|
||||
import cliSelect from "cli-select";
|
||||
import { getThisCodebaseRootDirPath } from "../src/bin/tools/getThisCodebaseRootDirPath";
|
||||
import chalk from "chalk";
|
||||
import { removeNodeModules } from "./tools/removeNodeModules";
|
||||
import { join } from "path";
|
||||
import { startRebuildOnSrcChange } from "./shared/startRebuildOnSrcChange";
|
||||
import { crawl } from "../src/bin/tools/crawl";
|
||||
|
||||
(async () => {
|
||||
const parentDirPath = pathJoin(getThisCodebaseRootDirPath(), "..");
|
||||
{
|
||||
const dirPath = "node_modules";
|
||||
|
||||
const { starterName } = await (async () => {
|
||||
const starterNames = fs
|
||||
.readdirSync(parentDirPath)
|
||||
.filter(
|
||||
basename =>
|
||||
basename.includes("starter") &&
|
||||
basename.includes("keycloakify") &&
|
||||
fs.statSync(pathJoin(parentDirPath, basename)).isDirectory()
|
||||
);
|
||||
try {
|
||||
fs.rmSync(dirPath, { recursive: true, force: true });
|
||||
} catch {
|
||||
// NOTE: This is a workaround for windows
|
||||
// we can't remove locked executables.
|
||||
|
||||
if (starterNames.length === 0) {
|
||||
console.log(
|
||||
chalk.red(
|
||||
`No starter found. Keycloakify Angular starter found in ${parentDirPath}`
|
||||
)
|
||||
);
|
||||
process.exit(-1);
|
||||
}
|
||||
|
||||
const starterName = await (async () => {
|
||||
if (starterNames.length === 1) {
|
||||
return starterNames[0];
|
||||
crawl({
|
||||
dirPath,
|
||||
returnedPathsType: "absolute"
|
||||
}).forEach(filePath => {
|
||||
try {
|
||||
fs.rmSync(filePath, { force: true });
|
||||
} catch (error) {
|
||||
if (filePath.endsWith(".exe")) {
|
||||
return;
|
||||
}
|
||||
throw error;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
console.log(chalk.cyan(`\nSelect a starter to link in:`));
|
||||
fs.rmSync("dist", { recursive: true, force: true });
|
||||
fs.rmSync(".yarn_home", { recursive: true, force: true });
|
||||
|
||||
const { value } = await cliSelect<string>({
|
||||
values: starterNames.map(starterName => `..${pathSep}${starterName}`)
|
||||
}).catch(() => {
|
||||
process.exit(-1);
|
||||
});
|
||||
run("yarn install");
|
||||
run("yarn build");
|
||||
|
||||
return value.split(pathSep)[1];
|
||||
})();
|
||||
const starterName = "keycloakify-starter";
|
||||
|
||||
return { starterName };
|
||||
})();
|
||||
fs.rmSync(join("..", starterName, "node_modules"), {
|
||||
recursive: true,
|
||||
force: true
|
||||
});
|
||||
|
||||
const startTime = Date.now();
|
||||
run("yarn install", { cwd: join("..", starterName) });
|
||||
|
||||
console.log(chalk.cyan(`\n\nLinking in ..${pathSep}${starterName}...`));
|
||||
run(`npx tsx ${join("scripts", "link-in-app.ts")} ${starterName}`);
|
||||
|
||||
removeNodeModules({
|
||||
nodeModulesDirPath: pathJoin(getThisCodebaseRootDirPath(), "node_modules")
|
||||
});
|
||||
startRebuildOnSrcChange();
|
||||
|
||||
fs.rmSync(pathJoin(getThisCodebaseRootDirPath(), "dist"), {
|
||||
recursive: true,
|
||||
force: true
|
||||
});
|
||||
fs.rmSync(pathJoin(getThisCodebaseRootDirPath(), ".yarn_home"), {
|
||||
recursive: true,
|
||||
force: true
|
||||
});
|
||||
function run(command: string, options?: { cwd: string }) {
|
||||
console.log(`$ ${command}`);
|
||||
|
||||
run("yarn install");
|
||||
run("yarn build");
|
||||
|
||||
const starterDirPath = pathJoin(parentDirPath, starterName);
|
||||
|
||||
removeNodeModules({
|
||||
nodeModulesDirPath: pathJoin(starterDirPath, "node_modules")
|
||||
});
|
||||
|
||||
run("yarn install", { cwd: starterDirPath });
|
||||
|
||||
run(`npx tsx ${pathJoin("scripts", "link-in-app.ts")} ${starterName}`);
|
||||
|
||||
const durationSeconds = Math.round((Date.now() - startTime) / 1000);
|
||||
|
||||
await new Promise(resolve => setTimeout(resolve, 1000));
|
||||
|
||||
startRebuildOnSrcChange();
|
||||
|
||||
console.log(chalk.green(`\n\nLinked in ${starterName} in ${durationSeconds}s`));
|
||||
})();
|
||||
child_process.execSync(command, { stdio: "inherit", ...options });
|
||||
}
|
||||
|
||||
@ -1,9 +0,0 @@
|
||||
import { join as pathJoin } from "path";
|
||||
import { getThisCodebaseRootDirPath } from "../../src/bin/tools/getThisCodebaseRootDirPath";
|
||||
|
||||
export const cacheDirPath = pathJoin(
|
||||
getThisCodebaseRootDirPath(),
|
||||
"node_modules",
|
||||
".cache",
|
||||
"scripts"
|
||||
);
|
||||
@ -2,9 +2,8 @@ import { relative as pathRelative } from "path";
|
||||
import { downloadAndExtractArchive } from "../../src/bin/tools/downloadAndExtractArchive";
|
||||
import { getProxyFetchOptions } from "../../src/bin/tools/fetchProxyOptions";
|
||||
import { join as pathJoin } from "path";
|
||||
import { assert, type Equals } from "tsafe/assert";
|
||||
import { cacheDirPath } from "./cacheDirPath";
|
||||
import { getThisCodebaseRootDirPath } from "../../src/bin/tools/getThisCodebaseRootDirPath";
|
||||
import { assert, type Equals } from "tsafe/assert";
|
||||
|
||||
const KEYCLOAK_VERSION = {
|
||||
FOR_LOGIN_THEME: "25.0.4",
|
||||
@ -23,7 +22,12 @@ export async function downloadKeycloakDefaultTheme(params: {
|
||||
|
||||
const { extractedDirPath } = await downloadAndExtractArchive({
|
||||
url: `https://repo1.maven.org/maven2/org/keycloak/keycloak-themes/${keycloakVersion}/keycloak-themes-${keycloakVersion}.jar`,
|
||||
cacheDirPath,
|
||||
cacheDirPath: pathJoin(
|
||||
getThisCodebaseRootDirPath(),
|
||||
"node_modules",
|
||||
".cache",
|
||||
"scripts"
|
||||
),
|
||||
fetchOptions: getProxyFetchOptions({
|
||||
npmConfigGetCwd: getThisCodebaseRootDirPath()
|
||||
}),
|
||||
|
||||
@ -1,8 +0,0 @@
|
||||
import * as child_process from "child_process";
|
||||
import chalk from "chalk";
|
||||
|
||||
export function run(command: string, options?: { cwd: string }) {
|
||||
console.log(chalk.grey(`$ ${command}`));
|
||||
|
||||
child_process.execSync(command, { stdio: "inherit", ...options });
|
||||
}
|
||||
@ -1,6 +1,5 @@
|
||||
import * as child_process from "child_process";
|
||||
import { startRebuildOnSrcChange } from "./shared/startRebuildOnSrcChange";
|
||||
import { run } from "./shared/run";
|
||||
|
||||
(async () => {
|
||||
run("yarn build");
|
||||
@ -19,3 +18,9 @@ import { run } from "./shared/run";
|
||||
|
||||
startRebuildOnSrcChange();
|
||||
})();
|
||||
|
||||
function run(command: string, options?: { env?: NodeJS.ProcessEnv }) {
|
||||
console.log(`$ ${command}`);
|
||||
|
||||
child_process.execSync(command, { stdio: "inherit", ...options });
|
||||
}
|
||||
|
||||
@ -1,27 +0,0 @@
|
||||
import * as fs from "fs";
|
||||
import { crawl } from "../../src/bin/tools/crawl";
|
||||
|
||||
export function removeNodeModules(params: { nodeModulesDirPath: string }) {
|
||||
const { nodeModulesDirPath } = params;
|
||||
|
||||
try {
|
||||
fs.rmSync(nodeModulesDirPath, { recursive: true, force: true });
|
||||
} catch {
|
||||
// NOTE: This is a workaround for windows
|
||||
// we can't remove locked executables.
|
||||
|
||||
crawl({
|
||||
dirPath: nodeModulesDirPath,
|
||||
returnedPathsType: "absolute"
|
||||
}).forEach(filePath => {
|
||||
try {
|
||||
fs.rmSync(filePath, { force: true });
|
||||
} catch (error) {
|
||||
if (filePath.endsWith(".exe")) {
|
||||
return;
|
||||
}
|
||||
throw error;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
@ -3,8 +3,6 @@ import { WELL_KNOWN_DIRECTORY_BASE_NAME } from "keycloakify/bin/shared/constants
|
||||
import { id } from "tsafe/id";
|
||||
import type { KcContext } from "./KcContext";
|
||||
import { BASE_URL } from "keycloakify/lib/BASE_URL";
|
||||
import { assert, type Equals } from "tsafe/assert";
|
||||
import type { LanguageTag } from "keycloakify/account/i18n/messages_defaultSet/types";
|
||||
|
||||
const resourcesPath = `${BASE_URL}${WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES}/account`;
|
||||
|
||||
@ -40,53 +38,35 @@ export const kcContextCommonMock: KcContext.Common = {
|
||||
exists: () => false
|
||||
},
|
||||
locale: {
|
||||
supported: (
|
||||
[
|
||||
/* spell-checker: disable */
|
||||
["de", "Deutsch"],
|
||||
["no", "Norsk"],
|
||||
["ru", "Русский"],
|
||||
["sv", "Svenska"],
|
||||
["pt-BR", "Português (Brasil)"],
|
||||
["lt", "Lietuvių"],
|
||||
["en", "English"],
|
||||
["it", "Italiano"],
|
||||
["fr", "Français"],
|
||||
["zh-CN", "中文简体"],
|
||||
["es", "Español"],
|
||||
["cs", "Čeština"],
|
||||
["ja", "日本語"],
|
||||
["sk", "Slovenčina"],
|
||||
["pl", "Polski"],
|
||||
["ca", "Català"],
|
||||
["nl", "Nederlands"],
|
||||
["tr", "Türkçe"],
|
||||
["ar", "العربية"],
|
||||
["da", "Dansk"],
|
||||
["fi", "Suomi"],
|
||||
["hu", "Magyar"],
|
||||
["lv", "Latviešu"]
|
||||
/* spell-checker: enable */
|
||||
] as const
|
||||
).map(([languageTag, label]) => {
|
||||
{
|
||||
type Got = typeof languageTag;
|
||||
type Expected = LanguageTag;
|
||||
|
||||
type Missing = Exclude<Expected, Got>;
|
||||
type Unexpected = Exclude<Got, Expected>;
|
||||
|
||||
assert<Equals<Missing, never>>;
|
||||
assert<Equals<Unexpected, never>>;
|
||||
}
|
||||
|
||||
return {
|
||||
languageTag,
|
||||
label,
|
||||
url: "https://gist.github.com/garronej/52baaca1bb925f2296ab32741e062b8e"
|
||||
} as const;
|
||||
}),
|
||||
|
||||
supported: [
|
||||
/* spell-checker: disable */
|
||||
["de", "Deutsch"],
|
||||
["no", "Norsk"],
|
||||
["ru", "Русский"],
|
||||
["sv", "Svenska"],
|
||||
["pt-BR", "Português (Brasil)"],
|
||||
["lt", "Lietuvių"],
|
||||
["en", "English"],
|
||||
["it", "Italiano"],
|
||||
["fr", "Français"],
|
||||
["zh-CN", "中文简体"],
|
||||
["es", "Español"],
|
||||
["cs", "Čeština"],
|
||||
["ja", "日本語"],
|
||||
["sk", "Slovenčina"],
|
||||
["pl", "Polski"],
|
||||
["ca", "Català"],
|
||||
["nl", "Nederlands"],
|
||||
["tr", "Türkçe"]
|
||||
/* spell-checker: enable */
|
||||
].map(
|
||||
([languageTag, label]) =>
|
||||
({
|
||||
languageTag,
|
||||
label,
|
||||
url: "https://gist.github.com/garronej/52baaca1bb925f2296ab32741e062b8e"
|
||||
}) as const
|
||||
),
|
||||
currentLanguageTag: "en"
|
||||
},
|
||||
features: {
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
import { useEffect } from "react";
|
||||
import { assert } from "keycloakify/tools/assert";
|
||||
import { clsx } from "keycloakify/tools/clsx";
|
||||
import { kcSanitize } from "keycloakify/lib/kcSanitize";
|
||||
import { getKcClsx } from "keycloakify/account/lib/kcClsx";
|
||||
import { useInsertLinkTags } from "keycloakify/tools/useInsertLinkTags";
|
||||
import { useSetClassName } from "keycloakify/tools/useSetClassName";
|
||||
import { useInitialize } from "keycloakify/account/Template.useInitialize";
|
||||
import type { TemplateProps } from "keycloakify/account/TemplateProps";
|
||||
import type { I18n } from "./i18n";
|
||||
import type { KcContext } from "./KcContext";
|
||||
@ -13,9 +13,9 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
|
||||
|
||||
const { kcClsx } = getKcClsx({ doUseDefaultCss, classes });
|
||||
|
||||
const { msg, msgStr, currentLanguage, enabledLanguages } = i18n;
|
||||
const { msg, msgStr, getChangeLocaleUrl, labelBySupportedLanguageTag, currentLanguageTag } = i18n;
|
||||
|
||||
const { url, features, realm, message, referrer } = kcContext;
|
||||
const { locale, url, features, realm, message, referrer } = kcContext;
|
||||
|
||||
useEffect(() => {
|
||||
document.title = msgStr("accountManagementTitle");
|
||||
@ -31,9 +31,30 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
|
||||
className: clsx("admin-console", "user", kcClsx("kcBodyClass"))
|
||||
});
|
||||
|
||||
const { isReadyToRender } = useInitialize({ kcContext, doUseDefaultCss });
|
||||
useEffect(() => {
|
||||
const { currentLanguageTag } = locale ?? {};
|
||||
|
||||
if (!isReadyToRender) {
|
||||
if (currentLanguageTag === undefined) {
|
||||
return;
|
||||
}
|
||||
|
||||
const html = document.querySelector("html");
|
||||
assert(html !== null);
|
||||
html.lang = currentLanguageTag;
|
||||
}, []);
|
||||
|
||||
const { areAllStyleSheetsLoaded } = useInsertLinkTags({
|
||||
componentOrHookName: "Template",
|
||||
hrefs: !doUseDefaultCss
|
||||
? []
|
||||
: [
|
||||
`${url.resourcesCommonPath}/node_modules/patternfly/dist/css/patternfly.min.css`,
|
||||
`${url.resourcesCommonPath}/node_modules/patternfly/dist/css/patternfly-additions.min.css`,
|
||||
`${url.resourcesPath}/css/account.css`
|
||||
]
|
||||
});
|
||||
|
||||
if (!areAllStyleSheetsLoaded) {
|
||||
return null;
|
||||
}
|
||||
|
||||
@ -49,16 +70,16 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
|
||||
<div className="navbar-collapse navbar-collapse-1">
|
||||
<div className="container">
|
||||
<ul className="nav navbar-nav navbar-utility">
|
||||
{enabledLanguages.length > 1 && (
|
||||
{realm.internationalizationEnabled && (assert(locale !== undefined), true) && locale.supported.length > 1 && (
|
||||
<li>
|
||||
<div className="kc-dropdown" id="kc-locale-dropdown">
|
||||
<a href="#" id="kc-current-locale-link">
|
||||
{currentLanguage.label}
|
||||
{labelBySupportedLanguageTag[currentLanguageTag]}
|
||||
</a>
|
||||
<ul>
|
||||
{enabledLanguages.map(({ languageTag, label, href }) => (
|
||||
{locale.supported.map(({ languageTag }) => (
|
||||
<li key={languageTag} className="kc-dropdown-item">
|
||||
<a href={href}>{label}</a>
|
||||
<a href={getChangeLocaleUrl(languageTag)}>{labelBySupportedLanguageTag[languageTag]}</a>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
@ -127,7 +148,7 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
|
||||
<span
|
||||
className="kc-feedback-text"
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: kcSanitize(message.summary)
|
||||
__html: message.summary
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@ -1,35 +0,0 @@
|
||||
import { assert } from "keycloakify/tools/assert";
|
||||
import { useInsertLinkTags } from "keycloakify/tools/useInsertLinkTags";
|
||||
import type { KcContext } from "keycloakify/account/KcContext";
|
||||
|
||||
export type KcContextLike = {
|
||||
url: {
|
||||
resourcesCommonPath: string;
|
||||
resourcesPath: string;
|
||||
};
|
||||
};
|
||||
|
||||
assert<keyof KcContextLike extends keyof KcContext ? true : false>();
|
||||
assert<KcContext extends KcContextLike ? true : false>();
|
||||
|
||||
export function useInitialize(params: {
|
||||
kcContext: KcContextLike;
|
||||
doUseDefaultCss: boolean;
|
||||
}) {
|
||||
const { kcContext, doUseDefaultCss } = params;
|
||||
|
||||
const { url } = kcContext;
|
||||
|
||||
const { areAllStyleSheetsLoaded } = useInsertLinkTags({
|
||||
componentOrHookName: "Template",
|
||||
hrefs: !doUseDefaultCss
|
||||
? []
|
||||
: [
|
||||
`${url.resourcesCommonPath}/node_modules/patternfly/dist/css/patternfly.min.css`,
|
||||
`${url.resourcesCommonPath}/node_modules/patternfly/dist/css/patternfly-additions.min.css`,
|
||||
`${url.resourcesPath}/css/account.css`
|
||||
]
|
||||
});
|
||||
|
||||
return { isReadyToRender: areAllStyleSheetsLoaded };
|
||||
}
|
||||
@ -1,5 +1,4 @@
|
||||
import type { ReactNode } from "react";
|
||||
import type { ClassKey } from "keycloakify/account/lib/kcClsx";
|
||||
|
||||
export type TemplateProps<KcContext, I18n> = {
|
||||
kcContext: KcContext;
|
||||
@ -11,4 +10,17 @@ export type TemplateProps<KcContext, I18n> = {
|
||||
active: string;
|
||||
};
|
||||
|
||||
export type { ClassKey };
|
||||
export type ClassKey =
|
||||
| "kcHtmlClass"
|
||||
| "kcBodyClass"
|
||||
| "kcButtonClass"
|
||||
| "kcButtonPrimaryClass"
|
||||
| "kcButtonLargeClass"
|
||||
| "kcButtonDefaultClass"
|
||||
| "kcContentWrapperClass"
|
||||
| "kcFormClass"
|
||||
| "kcFormGroupClass"
|
||||
| "kcInputWrapperClass"
|
||||
| "kcLabelClass"
|
||||
| "kcInputClass"
|
||||
| "kcInputErrorMessageClass";
|
||||
|
||||
6
src/account/i18n/GenericI18n.tsx
Normal file
6
src/account/i18n/GenericI18n.tsx
Normal file
@ -0,0 +1,6 @@
|
||||
import type { GenericI18n_noJsx } from "./i18n";
|
||||
|
||||
export type GenericI18n<MessageKey extends string> = GenericI18n_noJsx<MessageKey> & {
|
||||
msg: (key: MessageKey, ...args: (string | undefined)[]) => JSX.Element;
|
||||
advancedMsg: (key: string, ...args: (string | undefined)[]) => JSX.Element;
|
||||
};
|
||||
250
src/account/i18n/i18n.tsx
Normal file
250
src/account/i18n/i18n.tsx
Normal file
@ -0,0 +1,250 @@
|
||||
import "keycloakify/tools/Object.fromEntries";
|
||||
import { assert } from "tsafe/assert";
|
||||
import messages_defaultSet_fallbackLanguage from "./messages_defaultSet/en";
|
||||
import { fetchMessages_defaultSet } from "./messages_defaultSet";
|
||||
import type { KcContext } from "../KcContext";
|
||||
import { FALLBACK_LANGUAGE_TAG } from "keycloakify/bin/shared/constants";
|
||||
import { id } from "tsafe/id";
|
||||
|
||||
export type KcContextLike = {
|
||||
locale?: {
|
||||
currentLanguageTag: string;
|
||||
supported: { languageTag: string; url: string; label: string }[];
|
||||
};
|
||||
"x-keycloakify": {
|
||||
messages: Record<string, string>;
|
||||
};
|
||||
};
|
||||
|
||||
assert<KcContext extends KcContextLike ? true : false>();
|
||||
|
||||
export type GenericI18n_noJsx<MessageKey extends string> = {
|
||||
/**
|
||||
* e.g: "en", "fr", "zh-CN"
|
||||
*
|
||||
* The current language
|
||||
*/
|
||||
currentLanguageTag: string;
|
||||
/**
|
||||
* Redirect to this url to change the language.
|
||||
* After reload currentLanguageTag === newLanguageTag
|
||||
*/
|
||||
getChangeLocaleUrl: (newLanguageTag: string) => string;
|
||||
/**
|
||||
* e.g. "en" => "English", "fr" => "Français", ...
|
||||
*
|
||||
* Used to render a select that enable user to switch language.
|
||||
* ex: https://user-images.githubusercontent.com/6702424/186044799-38801eec-4e89-483b-81dd-8e9233e8c0eb.png
|
||||
* */
|
||||
labelBySupportedLanguageTag: Record<string, string>;
|
||||
/**
|
||||
*
|
||||
* Examples assuming currentLanguageTag === "en"
|
||||
* {
|
||||
* en: {
|
||||
* "access-denied": "Access denied",
|
||||
* "impersonateTitleHtml": "<strong>{0}</strong> Impersonate User",
|
||||
* "bar": "Bar {0}"
|
||||
* }
|
||||
* }
|
||||
*
|
||||
* msgStr("access-denied") === "Access denied"
|
||||
* msgStr("not-a-message-key") Throws an error
|
||||
* msgStr("impersonateTitleHtml", "Foo") === "<strong>Foo</strong> Impersonate User"
|
||||
* msgStr("${bar}", "<strong>c</strong>") === "Bar <strong>XXX</strong>"
|
||||
* The html in the arg is partially escaped for security reasons, it might come from an untrusted source, it's not safe to render it as html.
|
||||
*/
|
||||
msgStr: (key: MessageKey, ...args: (string | undefined)[]) => string;
|
||||
/**
|
||||
* This is meant to be used when the key argument is variable, something that might have been configured by the user
|
||||
* in the Keycloak admin for example.
|
||||
*
|
||||
* Examples assuming currentLanguageTag === "en"
|
||||
* {
|
||||
* en: {
|
||||
* "access-denied": "Access denied",
|
||||
* }
|
||||
* }
|
||||
*
|
||||
* advancedMsgStr("${access-denied}") === advancedMsgStr("access-denied") === msgStr("access-denied") === "Access denied"
|
||||
* advancedMsgStr("${not-a-message-key}") === advancedMsgStr("not-a-message-key") === "not-a-message-key"
|
||||
*/
|
||||
advancedMsgStr: (key: string, ...args: (string | undefined)[]) => string;
|
||||
|
||||
/**
|
||||
* Initially the messages are in english (fallback language).
|
||||
* The translations in the current language are being fetched dynamically.
|
||||
* This property is true while the translations are being fetched.
|
||||
*/
|
||||
isFetchingTranslations: boolean;
|
||||
};
|
||||
|
||||
export type MessageKey_defaultSet = keyof typeof messages_defaultSet_fallbackLanguage;
|
||||
|
||||
export function createGetI18n<MessageKey_themeDefined extends string = never>(messagesByLanguageTag_themeDefined: {
|
||||
[languageTag: string]: { [key in MessageKey_themeDefined]: string };
|
||||
}) {
|
||||
type I18n = GenericI18n_noJsx<MessageKey_defaultSet | MessageKey_themeDefined>;
|
||||
|
||||
type Result = { i18n: I18n; prI18n_currentLanguage: Promise<I18n> | undefined };
|
||||
|
||||
const cachedResultByKcContext = new WeakMap<KcContextLike, Result>();
|
||||
|
||||
function getI18n(params: { kcContext: KcContextLike }): Result {
|
||||
const { kcContext } = params;
|
||||
|
||||
use_cache: {
|
||||
const cachedResult = cachedResultByKcContext.get(kcContext);
|
||||
|
||||
if (cachedResult === undefined) {
|
||||
break use_cache;
|
||||
}
|
||||
|
||||
return cachedResult;
|
||||
}
|
||||
|
||||
const partialI18n: Pick<I18n, "currentLanguageTag" | "getChangeLocaleUrl" | "labelBySupportedLanguageTag"> = {
|
||||
currentLanguageTag: kcContext.locale?.currentLanguageTag ?? FALLBACK_LANGUAGE_TAG,
|
||||
getChangeLocaleUrl: newLanguageTag => {
|
||||
const { locale } = kcContext;
|
||||
|
||||
assert(locale !== undefined, "Internationalization not enabled");
|
||||
|
||||
const targetSupportedLocale = locale.supported.find(({ languageTag }) => languageTag === newLanguageTag);
|
||||
|
||||
assert(targetSupportedLocale !== undefined, `${newLanguageTag} need to be enabled in Keycloak admin`);
|
||||
|
||||
return targetSupportedLocale.url;
|
||||
},
|
||||
labelBySupportedLanguageTag: Object.fromEntries((kcContext.locale?.supported ?? []).map(({ languageTag, label }) => [languageTag, label]))
|
||||
};
|
||||
|
||||
const { createI18nTranslationFunctions } = createI18nTranslationFunctionsFactory<MessageKey_themeDefined>({
|
||||
messages_themeDefined:
|
||||
messagesByLanguageTag_themeDefined[partialI18n.currentLanguageTag] ??
|
||||
messagesByLanguageTag_themeDefined[FALLBACK_LANGUAGE_TAG] ??
|
||||
(() => {
|
||||
const firstLanguageTag = Object.keys(messagesByLanguageTag_themeDefined)[0];
|
||||
if (firstLanguageTag === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
return messagesByLanguageTag_themeDefined[firstLanguageTag];
|
||||
})(),
|
||||
messages_fromKcServer: kcContext["x-keycloakify"].messages
|
||||
});
|
||||
|
||||
const isCurrentLanguageFallbackLanguage = partialI18n.currentLanguageTag === FALLBACK_LANGUAGE_TAG;
|
||||
|
||||
const result: Result = {
|
||||
i18n: {
|
||||
...partialI18n,
|
||||
...createI18nTranslationFunctions({
|
||||
messages_defaultSet_currentLanguage: isCurrentLanguageFallbackLanguage ? messages_defaultSet_fallbackLanguage : undefined
|
||||
}),
|
||||
isFetchingTranslations: !isCurrentLanguageFallbackLanguage
|
||||
},
|
||||
prI18n_currentLanguage: isCurrentLanguageFallbackLanguage
|
||||
? undefined
|
||||
: (async () => {
|
||||
const messages_defaultSet_currentLanguage = await fetchMessages_defaultSet(partialI18n.currentLanguageTag);
|
||||
|
||||
const i18n_currentLanguage: I18n = {
|
||||
...partialI18n,
|
||||
...createI18nTranslationFunctions({ messages_defaultSet_currentLanguage }),
|
||||
isFetchingTranslations: false
|
||||
};
|
||||
|
||||
// NOTE: This promise.resolve is just because without it we TypeScript
|
||||
// gives a Variable 'result' is used before being assigned. error
|
||||
await Promise.resolve().then(() => {
|
||||
result.i18n = i18n_currentLanguage;
|
||||
result.prI18n_currentLanguage = undefined;
|
||||
});
|
||||
|
||||
return i18n_currentLanguage;
|
||||
})()
|
||||
};
|
||||
|
||||
cachedResultByKcContext.set(kcContext, result);
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
return { getI18n };
|
||||
}
|
||||
|
||||
function createI18nTranslationFunctionsFactory<MessageKey_themeDefined extends string>(params: {
|
||||
messages_themeDefined: Record<MessageKey_themeDefined, string> | undefined;
|
||||
messages_fromKcServer: Record<string, string>;
|
||||
}) {
|
||||
const { messages_themeDefined, messages_fromKcServer } = params;
|
||||
|
||||
function createI18nTranslationFunctions(params: {
|
||||
messages_defaultSet_currentLanguage: Partial<Record<MessageKey_defaultSet, string>> | undefined;
|
||||
}): Pick<GenericI18n_noJsx<MessageKey_defaultSet | MessageKey_themeDefined>, "msgStr" | "advancedMsgStr"> {
|
||||
const { messages_defaultSet_currentLanguage } = params;
|
||||
|
||||
function resolveMsg(props: { key: string; args: (string | undefined)[] }): string | undefined {
|
||||
const { key, args } = props;
|
||||
|
||||
const message =
|
||||
id<Record<string, string | undefined>>(messages_fromKcServer)[key] ??
|
||||
id<Record<string, string | undefined> | undefined>(messages_themeDefined)?.[key] ??
|
||||
id<Record<string, string | undefined> | undefined>(messages_defaultSet_currentLanguage)?.[key] ??
|
||||
id<Record<string, string | undefined>>(messages_defaultSet_fallbackLanguage)[key];
|
||||
|
||||
if (message === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
const startIndex = message
|
||||
.match(/{[0-9]+}/g)
|
||||
?.map(g => g.match(/{([0-9]+)}/)![1])
|
||||
.map(indexStr => parseInt(indexStr))
|
||||
.sort((a, b) => a - b)[0];
|
||||
|
||||
if (startIndex === undefined) {
|
||||
// No {0} in message (no arguments expected)
|
||||
return message;
|
||||
}
|
||||
|
||||
let messageWithArgsInjected = message;
|
||||
|
||||
args.forEach((arg, i) => {
|
||||
if (arg === undefined) {
|
||||
return;
|
||||
}
|
||||
|
||||
messageWithArgsInjected = messageWithArgsInjected.replace(
|
||||
new RegExp(`\\{${i + startIndex}\\}`, "g"),
|
||||
arg.replace(/</g, "<").replace(/>/g, ">")
|
||||
);
|
||||
});
|
||||
|
||||
return messageWithArgsInjected;
|
||||
}
|
||||
|
||||
function resolveMsgAdvanced(props: { key: string; args: (string | undefined)[] }): string {
|
||||
const { key, args } = props;
|
||||
|
||||
const match = key.match(/^\$\{(.+)\}$/);
|
||||
|
||||
if (match === null) {
|
||||
return key;
|
||||
}
|
||||
|
||||
return resolveMsg({ key: match[1], args }) ?? key;
|
||||
}
|
||||
|
||||
return {
|
||||
msgStr: (key, ...args) => {
|
||||
const resolvedMessage = resolveMsg({ key, args });
|
||||
assert(resolvedMessage !== undefined, `Message with key "${key}" not found`);
|
||||
return resolvedMessage;
|
||||
},
|
||||
advancedMsgStr: (key, ...args) => resolveMsgAdvanced({ key, args })
|
||||
};
|
||||
}
|
||||
|
||||
return { createI18nTranslationFunctions };
|
||||
}
|
||||
5
src/account/i18n/index.ts
Normal file
5
src/account/i18n/index.ts
Normal file
@ -0,0 +1,5 @@
|
||||
import type { GenericI18n } from "./GenericI18n";
|
||||
import type { MessageKey_defaultSet, KcContextLike } from "./i18n";
|
||||
export type { MessageKey_defaultSet, KcContextLike };
|
||||
export type I18n = GenericI18n<MessageKey_defaultSet>;
|
||||
export { createUseI18n } from "./useI18n";
|
||||
95
src/account/i18n/useI18n.tsx
Normal file
95
src/account/i18n/useI18n.tsx
Normal file
@ -0,0 +1,95 @@
|
||||
import { useEffect, useState } from "react";
|
||||
import { createGetI18n, type GenericI18n_noJsx, type KcContextLike, type MessageKey_defaultSet } from "./i18n";
|
||||
import { GenericI18n } from "./GenericI18n";
|
||||
import { Reflect } from "tsafe/Reflect";
|
||||
|
||||
export function createUseI18n<MessageKey_themeDefined extends string = never>(messagesByLanguageTag: {
|
||||
[languageTag: string]: { [key in MessageKey_themeDefined]: string };
|
||||
}) {
|
||||
type MessageKey = MessageKey_defaultSet | MessageKey_themeDefined;
|
||||
|
||||
type I18n = GenericI18n<MessageKey>;
|
||||
|
||||
const { withJsx } = (() => {
|
||||
const cache = new WeakMap<GenericI18n_noJsx<MessageKey>, GenericI18n<MessageKey>>();
|
||||
|
||||
function renderHtmlString(params: { htmlString: string; msgKey: string }): JSX.Element {
|
||||
const { htmlString, msgKey } = params;
|
||||
return (
|
||||
<div
|
||||
data-kc-msg={msgKey}
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: htmlString
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
function withJsx(i18n_noJsx: GenericI18n_noJsx<MessageKey>): I18n {
|
||||
use_cache: {
|
||||
const i18n = cache.get(i18n_noJsx);
|
||||
|
||||
if (i18n === undefined) {
|
||||
break use_cache;
|
||||
}
|
||||
|
||||
return i18n;
|
||||
}
|
||||
|
||||
const i18n: I18n = {
|
||||
...i18n_noJsx,
|
||||
msg: (msgKey, ...args) => renderHtmlString({ htmlString: i18n_noJsx.msgStr(msgKey, ...args), msgKey }),
|
||||
advancedMsg: (msgKey, ...args) => renderHtmlString({ htmlString: i18n_noJsx.advancedMsgStr(msgKey, ...args), msgKey })
|
||||
};
|
||||
|
||||
cache.set(i18n_noJsx, i18n);
|
||||
|
||||
return i18n;
|
||||
}
|
||||
|
||||
return { withJsx };
|
||||
})();
|
||||
|
||||
add_style: {
|
||||
const attributeName = "data-kc-i18n";
|
||||
|
||||
// Check if already exists in head
|
||||
if (document.querySelector(`style[${attributeName}]`) !== null) {
|
||||
break add_style;
|
||||
}
|
||||
|
||||
const styleElement = document.createElement("style");
|
||||
styleElement.attributes.setNamedItem(document.createAttribute(attributeName));
|
||||
(styleElement.textContent = `[data-kc-msg] { display: inline-block; }`), document.head.prepend(styleElement);
|
||||
}
|
||||
|
||||
const { getI18n } = createGetI18n(messagesByLanguageTag);
|
||||
|
||||
function useI18n(params: { kcContext: KcContextLike }): { i18n: I18n } {
|
||||
const { kcContext } = params;
|
||||
|
||||
const { i18n, prI18n_currentLanguage } = getI18n({ kcContext });
|
||||
|
||||
const [i18n_toReturn, setI18n_toReturn] = useState<I18n>(withJsx(i18n));
|
||||
|
||||
useEffect(() => {
|
||||
let isActive = true;
|
||||
|
||||
prI18n_currentLanguage?.then(i18n => {
|
||||
if (!isActive) {
|
||||
return;
|
||||
}
|
||||
|
||||
setI18n_toReturn(withJsx(i18n));
|
||||
});
|
||||
|
||||
return () => {
|
||||
isActive = false;
|
||||
};
|
||||
}, []);
|
||||
|
||||
return { i18n: i18n_toReturn };
|
||||
}
|
||||
|
||||
return { useI18n, ofTypeI18n: Reflect<I18n>() };
|
||||
}
|
||||
@ -1,3 +1,3 @@
|
||||
export type { ExtendKcContext } from "keycloakify/account/KcContext";
|
||||
export type { ClassKey } from "keycloakify/account/TemplateProps";
|
||||
export { i18nBuilder, type MessageKey_defaultSet } from "keycloakify/account/i18n";
|
||||
export { createUseI18n } from "keycloakify/account/i18n";
|
||||
|
||||
@ -1,19 +1,5 @@
|
||||
import { createGetKcClsx } from "keycloakify/lib/getKcClsx";
|
||||
|
||||
export type ClassKey =
|
||||
| "kcHtmlClass"
|
||||
| "kcBodyClass"
|
||||
| "kcButtonClass"
|
||||
| "kcButtonPrimaryClass"
|
||||
| "kcButtonLargeClass"
|
||||
| "kcButtonDefaultClass"
|
||||
| "kcContentWrapperClass"
|
||||
| "kcFormClass"
|
||||
| "kcFormGroupClass"
|
||||
| "kcInputWrapperClass"
|
||||
| "kcLabelClass"
|
||||
| "kcInputClass"
|
||||
| "kcInputErrorMessageClass";
|
||||
import type { ClassKey } from "keycloakify/account/TemplateProps";
|
||||
|
||||
export const { getKcClsx } = createGetKcClsx<ClassKey>({
|
||||
defaultClasses: {
|
||||
@ -34,4 +20,6 @@ export const { getKcClsx } = createGetKcClsx<ClassKey>({
|
||||
}
|
||||
});
|
||||
|
||||
export type { ClassKey };
|
||||
|
||||
export type KcClsx = ReturnType<typeof getKcClsx>["kcClsx"];
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
import { clsx } from "keycloakify/tools/clsx";
|
||||
import { getKcClsx } from "keycloakify/account/lib/kcClsx";
|
||||
import { kcSanitize } from "keycloakify/lib/kcSanitize";
|
||||
import type { PageProps } from "keycloakify/account/pages/PageProps";
|
||||
import type { KcContext } from "../KcContext";
|
||||
import type { I18n } from "../i18n";
|
||||
@ -160,7 +159,7 @@ export default function Totp(props: PageProps<Extract<KcContext, { pageId: "totp
|
||||
className={kcClsx("kcInputErrorMessageClass")}
|
||||
aria-live="polite"
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: kcSanitize(messagesPerField.get("totp"))
|
||||
__html: messagesPerField.get("totp")
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
@ -191,7 +190,7 @@ export default function Totp(props: PageProps<Extract<KcContext, { pageId: "totp
|
||||
className={kcClsx("kcInputErrorMessageClass")}
|
||||
aria-live="polite"
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: kcSanitize(messagesPerField.get("userLabel"))
|
||||
__html: messagesPerField.get("userLabel")
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
|
||||
@ -5,30 +5,25 @@ import {
|
||||
ACCOUNT_THEME_PAGE_IDS,
|
||||
type LoginThemePageId,
|
||||
type AccountThemePageId,
|
||||
THEME_TYPES
|
||||
THEME_TYPES,
|
||||
type ThemeType
|
||||
} from "./shared/constants";
|
||||
import { capitalize } from "tsafe/capitalize";
|
||||
import * as fs from "fs";
|
||||
import { join as pathJoin, relative as pathRelative, dirname as pathDirname } from "path";
|
||||
import { kebabCaseToCamelCase } from "./tools/kebabCaseToSnakeCase";
|
||||
import { assert, Equals } from "tsafe/assert";
|
||||
import type { BuildContext } from "./shared/buildContext";
|
||||
import type { CliCommandOptions } from "./main";
|
||||
import { getBuildContext } from "./shared/buildContext";
|
||||
import chalk from "chalk";
|
||||
import { runPrettier, getIsPrettierAvailable } from "./tools/runPrettier";
|
||||
import { maybeDelegateCommandToCustomHandler } from "./shared/customHandler_delegate";
|
||||
|
||||
export async function command(params: { buildContext: BuildContext }) {
|
||||
const { buildContext } = params;
|
||||
export async function command(params: { cliCommandOptions: CliCommandOptions }) {
|
||||
const { cliCommandOptions } = params;
|
||||
|
||||
const { hasBeenHandled } = maybeDelegateCommandToCustomHandler({
|
||||
commandName: "add-story",
|
||||
buildContext
|
||||
const buildContext = getBuildContext({
|
||||
cliCommandOptions
|
||||
});
|
||||
|
||||
if (hasBeenHandled) {
|
||||
return;
|
||||
}
|
||||
|
||||
console.log(chalk.cyan("Theme type:"));
|
||||
|
||||
const themeType = await (async () => {
|
||||
@ -38,8 +33,6 @@ export async function command(params: { buildContext: BuildContext }) {
|
||||
return buildContext.implementedThemeTypes.account.isImplemented;
|
||||
case "login":
|
||||
return buildContext.implementedThemeTypes.login.isImplemented;
|
||||
case "admin":
|
||||
return buildContext.implementedThemeTypes.admin.isImplemented;
|
||||
}
|
||||
assert<Equals<typeof themeType, never>>(false);
|
||||
});
|
||||
@ -50,7 +43,7 @@ export async function command(params: { buildContext: BuildContext }) {
|
||||
return values[0];
|
||||
}
|
||||
|
||||
const { value } = await cliSelect({
|
||||
const { value } = await cliSelect<ThemeType>({
|
||||
values
|
||||
}).catch(() => {
|
||||
process.exit(-1);
|
||||
@ -69,16 +62,6 @@ export async function command(params: { buildContext: BuildContext }) {
|
||||
);
|
||||
|
||||
process.exit(0);
|
||||
return;
|
||||
}
|
||||
|
||||
if (themeType === "admin") {
|
||||
console.log(
|
||||
`${chalk.red("✗")} Sorry, there is no Storybook support for the Account UI.`
|
||||
);
|
||||
|
||||
process.exit(0);
|
||||
return;
|
||||
}
|
||||
|
||||
console.log(`→ ${themeType}`);
|
||||
@ -119,7 +102,7 @@ export async function command(params: { buildContext: BuildContext }) {
|
||||
process.exit(-1);
|
||||
}
|
||||
|
||||
let sourceCode = fs
|
||||
const componentCode = fs
|
||||
.readFileSync(
|
||||
pathJoin(
|
||||
getThisCodebaseRootDirPath(),
|
||||
@ -133,17 +116,6 @@ export async function command(params: { buildContext: BuildContext }) {
|
||||
.replace('import React from "react";\n', "")
|
||||
.replace(/from "[./]+dist\//, 'from "keycloakify/');
|
||||
|
||||
run_prettier: {
|
||||
if (!(await getIsPrettierAvailable())) {
|
||||
break run_prettier;
|
||||
}
|
||||
|
||||
sourceCode = await runPrettier({
|
||||
filePath: targetFilePath,
|
||||
sourceCode: sourceCode
|
||||
});
|
||||
}
|
||||
|
||||
{
|
||||
const targetDirPath = pathDirname(targetFilePath);
|
||||
|
||||
@ -152,7 +124,7 @@ export async function command(params: { buildContext: BuildContext }) {
|
||||
}
|
||||
}
|
||||
|
||||
fs.writeFileSync(targetFilePath, Buffer.from(sourceCode, "utf8"));
|
||||
fs.writeFileSync(targetFilePath, Buffer.from(componentCode, "utf8"));
|
||||
|
||||
console.log(
|
||||
[
|
||||
|
||||
@ -1,96 +1,13 @@
|
||||
import { maybeDelegateCommandToCustomHandler } from "./shared/customHandler_delegate";
|
||||
import { join as pathJoin, dirname as pathDirname } from "path";
|
||||
import { WELL_KNOWN_DIRECTORY_BASE_NAME } from "./shared/constants";
|
||||
import { readThisNpmPackageVersion } from "./tools/readThisNpmPackageVersion";
|
||||
import * as fs from "fs";
|
||||
import { rmSync } from "./tools/fs.rmSync";
|
||||
import type { BuildContext } from "./shared/buildContext";
|
||||
import { transformCodebase } from "./tools/transformCodebase";
|
||||
import { getThisCodebaseRootDirPath } from "./tools/getThisCodebaseRootDirPath";
|
||||
import { copyKeycloakResourcesToPublic } from "./shared/copyKeycloakResourcesToPublic";
|
||||
import { getBuildContext } from "./shared/buildContext";
|
||||
import type { CliCommandOptions } from "./main";
|
||||
|
||||
export async function command(params: { buildContext: BuildContext }) {
|
||||
const { buildContext } = params;
|
||||
export async function command(params: { cliCommandOptions: CliCommandOptions }) {
|
||||
const { cliCommandOptions } = params;
|
||||
|
||||
const { hasBeenHandled } = maybeDelegateCommandToCustomHandler({
|
||||
commandName: "copy-keycloak-resources-to-public",
|
||||
const buildContext = getBuildContext({ cliCommandOptions });
|
||||
|
||||
copyKeycloakResourcesToPublic({
|
||||
buildContext
|
||||
});
|
||||
|
||||
if (hasBeenHandled) {
|
||||
return;
|
||||
}
|
||||
|
||||
const destDirPath = pathJoin(
|
||||
buildContext.publicDirPath,
|
||||
WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES
|
||||
);
|
||||
|
||||
const keycloakifyBuildinfoFilePath = pathJoin(destDirPath, "keycloakify.buildinfo");
|
||||
|
||||
const keycloakifyBuildinfoRaw = JSON.stringify(
|
||||
{
|
||||
keycloakifyVersion: readThisNpmPackageVersion()
|
||||
},
|
||||
null,
|
||||
2
|
||||
);
|
||||
|
||||
skip_if_already_done: {
|
||||
if (!fs.existsSync(keycloakifyBuildinfoFilePath)) {
|
||||
break skip_if_already_done;
|
||||
}
|
||||
|
||||
const keycloakifyBuildinfoRaw_previousRun = fs
|
||||
.readFileSync(keycloakifyBuildinfoFilePath)
|
||||
.toString("utf8");
|
||||
|
||||
if (keycloakifyBuildinfoRaw_previousRun !== keycloakifyBuildinfoRaw) {
|
||||
break skip_if_already_done;
|
||||
}
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
rmSync(destDirPath, { force: true, recursive: true });
|
||||
|
||||
// NOTE: To remove in a while, remove the legacy keycloak-resources directory
|
||||
rmSync(pathJoin(pathDirname(destDirPath), "keycloak-resources"), {
|
||||
force: true,
|
||||
recursive: true
|
||||
});
|
||||
rmSync(pathJoin(pathDirname(destDirPath), ".keycloakify"), {
|
||||
force: true,
|
||||
recursive: true
|
||||
});
|
||||
|
||||
fs.mkdirSync(destDirPath, { recursive: true });
|
||||
|
||||
fs.writeFileSync(pathJoin(destDirPath, ".gitignore"), Buffer.from("*", "utf8"));
|
||||
|
||||
transformCodebase({
|
||||
srcDirPath: pathJoin(
|
||||
getThisCodebaseRootDirPath(),
|
||||
"res",
|
||||
"public",
|
||||
WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES
|
||||
),
|
||||
destDirPath
|
||||
});
|
||||
|
||||
fs.writeFileSync(
|
||||
pathJoin(destDirPath, "README.txt"),
|
||||
Buffer.from(
|
||||
// prettier-ignore
|
||||
[
|
||||
"This directory is only used in dev mode by Keycloakify",
|
||||
"It won't be included in your final build.",
|
||||
"Do not modify anything in this directory.",
|
||||
].join("\n")
|
||||
)
|
||||
);
|
||||
|
||||
fs.writeFileSync(
|
||||
keycloakifyBuildinfoFilePath,
|
||||
Buffer.from(keycloakifyBuildinfoRaw, "utf8")
|
||||
);
|
||||
}
|
||||
|
||||
@ -1,68 +0,0 @@
|
||||
import type { BuildContext } from "./shared/buildContext";
|
||||
import { getUiModuleFileSourceCodeReadyToBeCopied } from "./postinstall/getUiModuleFileSourceCodeReadyToBeCopied";
|
||||
import { getAbsoluteAndInOsFormatPath } from "./tools/getAbsoluteAndInOsFormatPath";
|
||||
import { relative as pathRelative, dirname as pathDirname, join as pathJoin } from "path";
|
||||
import { getUiModuleMetas } from "./postinstall/uiModuleMeta";
|
||||
import { getInstalledModuleDirPath } from "./tools/getInstalledModuleDirPath";
|
||||
import * as fsPr from "fs/promises";
|
||||
import {
|
||||
readManagedGitignoreFile,
|
||||
writeManagedGitignoreFile
|
||||
} from "./postinstall/managedGitignoreFile";
|
||||
|
||||
export async function command(params: {
|
||||
buildContext: BuildContext;
|
||||
cliCommandOptions: {
|
||||
file: string;
|
||||
};
|
||||
}) {
|
||||
const { buildContext, cliCommandOptions } = params;
|
||||
|
||||
const fileRelativePath = pathRelative(
|
||||
buildContext.themeSrcDirPath,
|
||||
getAbsoluteAndInOsFormatPath({
|
||||
cwd: buildContext.themeSrcDirPath,
|
||||
pathIsh: cliCommandOptions.file
|
||||
})
|
||||
);
|
||||
|
||||
const uiModuleMetas = await getUiModuleMetas({ buildContext });
|
||||
|
||||
const uiModuleMeta = uiModuleMetas.find(({ files }) =>
|
||||
files.map(({ fileRelativePath }) => fileRelativePath).includes(fileRelativePath)
|
||||
);
|
||||
|
||||
if (!uiModuleMeta) {
|
||||
throw new Error(`No UI module found for the file ${fileRelativePath}`);
|
||||
}
|
||||
|
||||
const uiModuleDirPath = await getInstalledModuleDirPath({
|
||||
moduleName: uiModuleMeta.moduleName,
|
||||
packageJsonDirPath: pathDirname(buildContext.packageJsonFilePath),
|
||||
projectDirPath: buildContext.projectDirPath
|
||||
});
|
||||
|
||||
const sourceCode = await getUiModuleFileSourceCodeReadyToBeCopied({
|
||||
buildContext,
|
||||
fileRelativePath,
|
||||
isForEjection: true,
|
||||
uiModuleName: uiModuleMeta.moduleName,
|
||||
uiModuleDirPath,
|
||||
uiModuleVersion: uiModuleMeta.version
|
||||
});
|
||||
|
||||
await fsPr.writeFile(
|
||||
pathJoin(buildContext.themeSrcDirPath, fileRelativePath),
|
||||
sourceCode
|
||||
);
|
||||
|
||||
const { ejectedFilesRelativePaths } = await readManagedGitignoreFile({
|
||||
buildContext
|
||||
});
|
||||
|
||||
await writeManagedGitignoreFile({
|
||||
buildContext,
|
||||
uiModuleMetas,
|
||||
ejectedFilesRelativePaths: [...ejectedFilesRelativePaths, fileRelativePath]
|
||||
});
|
||||
}
|
||||
@ -7,7 +7,8 @@ import {
|
||||
ACCOUNT_THEME_PAGE_IDS,
|
||||
type LoginThemePageId,
|
||||
type AccountThemePageId,
|
||||
THEME_TYPES
|
||||
THEME_TYPES,
|
||||
type ThemeType
|
||||
} from "./shared/constants";
|
||||
import { capitalize } from "tsafe/capitalize";
|
||||
import * as fs from "fs";
|
||||
@ -19,23 +20,17 @@ import {
|
||||
} from "path";
|
||||
import { kebabCaseToCamelCase } from "./tools/kebabCaseToSnakeCase";
|
||||
import { assert, Equals } from "tsafe/assert";
|
||||
import type { BuildContext } from "./shared/buildContext";
|
||||
import type { CliCommandOptions } from "./main";
|
||||
import { getBuildContext } from "./shared/buildContext";
|
||||
import chalk from "chalk";
|
||||
import { maybeDelegateCommandToCustomHandler } from "./shared/customHandler_delegate";
|
||||
import { runPrettier, getIsPrettierAvailable } from "./tools/runPrettier";
|
||||
|
||||
export async function command(params: { buildContext: BuildContext }) {
|
||||
const { buildContext } = params;
|
||||
export async function command(params: { cliCommandOptions: CliCommandOptions }) {
|
||||
const { cliCommandOptions } = params;
|
||||
|
||||
const { hasBeenHandled } = maybeDelegateCommandToCustomHandler({
|
||||
commandName: "eject-page",
|
||||
buildContext
|
||||
const buildContext = getBuildContext({
|
||||
cliCommandOptions
|
||||
});
|
||||
|
||||
if (hasBeenHandled) {
|
||||
return;
|
||||
}
|
||||
|
||||
console.log(chalk.cyan("Theme type:"));
|
||||
|
||||
const themeType = await (async () => {
|
||||
@ -45,8 +40,6 @@ export async function command(params: { buildContext: BuildContext }) {
|
||||
return buildContext.implementedThemeTypes.account.isImplemented;
|
||||
case "login":
|
||||
return buildContext.implementedThemeTypes.login.isImplemented;
|
||||
case "admin":
|
||||
return buildContext.implementedThemeTypes.admin.isImplemented;
|
||||
}
|
||||
assert<Equals<typeof themeType, never>>(false);
|
||||
});
|
||||
@ -57,7 +50,7 @@ export async function command(params: { buildContext: BuildContext }) {
|
||||
return values[0];
|
||||
}
|
||||
|
||||
const { value } = await cliSelect({
|
||||
const { value } = await cliSelect<ThemeType>({
|
||||
values
|
||||
}).catch(() => {
|
||||
process.exit(-1);
|
||||
@ -66,14 +59,6 @@ export async function command(params: { buildContext: BuildContext }) {
|
||||
return value;
|
||||
})();
|
||||
|
||||
if (themeType === "admin") {
|
||||
console.log(
|
||||
"Use `npx keycloakify eject-file` command instead, see documentation"
|
||||
);
|
||||
|
||||
process.exit(-1);
|
||||
}
|
||||
|
||||
if (
|
||||
themeType === "account" &&
|
||||
(assert(buildContext.implementedThemeTypes.account.isImplemented),
|
||||
@ -83,13 +68,13 @@ export async function command(params: { buildContext: BuildContext }) {
|
||||
pathDirname(buildContext.packageJsonFilePath),
|
||||
"node_modules",
|
||||
"@keycloakify",
|
||||
`keycloak-account-ui`,
|
||||
"keycloak-account-ui",
|
||||
"src"
|
||||
);
|
||||
|
||||
console.log(
|
||||
[
|
||||
`There isn't an interactive CLI to eject components of the Account SPA UI.`,
|
||||
`There isn't an interactive CLI to eject components of the Single-Page Account theme.`,
|
||||
`You can however copy paste into your codebase the any file or directory from the following source directory:`,
|
||||
``,
|
||||
`${chalk.bold(pathJoin(pathRelative(process.cwd(), srcDirPath)))}`,
|
||||
@ -98,44 +83,41 @@ export async function command(params: { buildContext: BuildContext }) {
|
||||
);
|
||||
|
||||
eject_entrypoint: {
|
||||
const kcUiTsxFileRelativePath = `KcAccountUi.tsx` as const;
|
||||
const kcAccountUiTsxFileRelativePath = "KcAccountUi.tsx";
|
||||
|
||||
const themeSrcDirPath = pathJoin(buildContext.themeSrcDirPath, "account");
|
||||
const accountThemeSrcDirPath = pathJoin(
|
||||
buildContext.themeSrcDirPath,
|
||||
"account"
|
||||
);
|
||||
|
||||
const targetFilePath = pathJoin(themeSrcDirPath, kcUiTsxFileRelativePath);
|
||||
const targetFilePath = pathJoin(
|
||||
accountThemeSrcDirPath,
|
||||
kcAccountUiTsxFileRelativePath
|
||||
);
|
||||
|
||||
if (fs.existsSync(targetFilePath)) {
|
||||
break eject_entrypoint;
|
||||
}
|
||||
|
||||
fs.cpSync(pathJoin(srcDirPath, kcUiTsxFileRelativePath), targetFilePath);
|
||||
fs.cpSync(
|
||||
pathJoin(srcDirPath, kcAccountUiTsxFileRelativePath),
|
||||
targetFilePath
|
||||
);
|
||||
|
||||
{
|
||||
const kcPageTsxFilePath = pathJoin(themeSrcDirPath, "KcPage.tsx");
|
||||
const kcPageTsxFilePath = pathJoin(accountThemeSrcDirPath, "KcPage.tsx");
|
||||
|
||||
const kcPageTsxCode = fs.readFileSync(kcPageTsxFilePath).toString("utf8");
|
||||
|
||||
const componentName = pathBasename(kcUiTsxFileRelativePath).replace(
|
||||
/.tsx$/,
|
||||
""
|
||||
);
|
||||
const componentName = pathBasename(
|
||||
kcAccountUiTsxFileRelativePath
|
||||
).replace(/.tsx$/, "");
|
||||
|
||||
let modifiedKcPageTsxCode = kcPageTsxCode.replace(
|
||||
const modifiedKcPageTsxCode = kcPageTsxCode.replace(
|
||||
`@keycloakify/keycloak-account-ui/${componentName}`,
|
||||
`./${componentName}`
|
||||
);
|
||||
|
||||
run_prettier: {
|
||||
if (!(await getIsPrettierAvailable())) {
|
||||
break run_prettier;
|
||||
}
|
||||
|
||||
modifiedKcPageTsxCode = await runPrettier({
|
||||
filePath: kcPageTsxFilePath,
|
||||
sourceCode: modifiedKcPageTsxCode
|
||||
});
|
||||
}
|
||||
|
||||
fs.writeFileSync(
|
||||
kcPageTsxFilePath,
|
||||
Buffer.from(modifiedKcPageTsxCode, "utf8")
|
||||
@ -151,14 +133,13 @@ export async function command(params: { buildContext: BuildContext }) {
|
||||
[
|
||||
`To help you get started ${chalk.bold(pathRelative(process.cwd(), targetFilePath))} has been copied into your project.`,
|
||||
`The next step is usually to eject ${chalk.bold(routesTsxFilePath)}`,
|
||||
`with \`cp ${routesTsxFilePath} ${pathRelative(process.cwd(), themeSrcDirPath)}\``,
|
||||
`then update the import of routes in ${kcUiTsxFileRelativePath}.`
|
||||
`with \`cp ${routesTsxFilePath} ${pathRelative(process.cwd(), accountThemeSrcDirPath)}\``,
|
||||
`then update the import of routes in ${kcAccountUiTsxFileRelativePath}.`
|
||||
].join("\n")
|
||||
);
|
||||
}
|
||||
|
||||
process.exit(0);
|
||||
return;
|
||||
}
|
||||
|
||||
console.log(`→ ${themeType}`);
|
||||
@ -235,7 +216,7 @@ export async function command(params: { buildContext: BuildContext }) {
|
||||
process.exit(-1);
|
||||
}
|
||||
|
||||
let componentCode = fs
|
||||
const componentCode = fs
|
||||
.readFileSync(
|
||||
pathJoin(
|
||||
getThisCodebaseRootDirPath(),
|
||||
@ -247,17 +228,6 @@ export async function command(params: { buildContext: BuildContext }) {
|
||||
)
|
||||
.toString("utf8");
|
||||
|
||||
run_prettier: {
|
||||
if (!(await getIsPrettierAvailable())) {
|
||||
break run_prettier;
|
||||
}
|
||||
|
||||
componentCode = await runPrettier({
|
||||
filePath: targetFilePath,
|
||||
sourceCode: componentCode
|
||||
});
|
||||
}
|
||||
|
||||
{
|
||||
const targetDirPath = pathDirname(targetFilePath);
|
||||
|
||||
@ -274,12 +244,12 @@ export async function command(params: { buildContext: BuildContext }) {
|
||||
)} copy pasted from the Keycloakify source code into your project`
|
||||
);
|
||||
|
||||
edit_KcPage: {
|
||||
edit_KcApp: {
|
||||
if (
|
||||
pageIdOrComponent !== templateValue &&
|
||||
pageIdOrComponent !== userProfileFormFieldsValue
|
||||
) {
|
||||
break edit_KcPage;
|
||||
break edit_KcApp;
|
||||
}
|
||||
|
||||
const kcAppTsxPath = pathJoin(
|
||||
|
||||
@ -1,24 +1,17 @@
|
||||
import type { BuildContext } from "../shared/buildContext";
|
||||
import { getBuildContext } from "../shared/buildContext";
|
||||
import type { CliCommandOptions } from "../main";
|
||||
import cliSelect from "cli-select";
|
||||
import child_process from "child_process";
|
||||
import chalk from "chalk";
|
||||
import { join as pathJoin, relative as pathRelative } from "path";
|
||||
import * as fs from "fs";
|
||||
import { updateAccountThemeImplementationInConfig } from "./updateAccountThemeImplementationInConfig";
|
||||
import { command as updateKcGenCommand } from "../update-kc-gen";
|
||||
import { maybeDelegateCommandToCustomHandler } from "../shared/customHandler_delegate";
|
||||
import { exitIfUncommittedChanges } from "../shared/exitIfUncommittedChanges";
|
||||
import { generateKcGenTs } from "../shared/generateKcGenTs";
|
||||
|
||||
export async function command(params: { buildContext: BuildContext }) {
|
||||
const { buildContext } = params;
|
||||
export async function command(params: { cliCommandOptions: CliCommandOptions }) {
|
||||
const { cliCommandOptions } = params;
|
||||
|
||||
const { hasBeenHandled } = maybeDelegateCommandToCustomHandler({
|
||||
commandName: "initialize-account-theme",
|
||||
buildContext
|
||||
});
|
||||
|
||||
if (hasBeenHandled) {
|
||||
return;
|
||||
}
|
||||
const buildContext = getBuildContext({ cliCommandOptions });
|
||||
|
||||
const accountThemeSrcDirPath = pathJoin(buildContext.themeSrcDirPath, "account");
|
||||
|
||||
@ -38,9 +31,37 @@ export async function command(params: { buildContext: BuildContext }) {
|
||||
process.exit(-1);
|
||||
}
|
||||
|
||||
exitIfUncommittedChanges({
|
||||
projectDirPath: buildContext.projectDirPath
|
||||
});
|
||||
exit_if_uncommitted_changes: {
|
||||
let hasUncommittedChanges: boolean | undefined = undefined;
|
||||
|
||||
try {
|
||||
hasUncommittedChanges =
|
||||
child_process
|
||||
.execSync(`git status --porcelain`, {
|
||||
cwd: buildContext.projectDirPath
|
||||
})
|
||||
.toString()
|
||||
.trim() !== "";
|
||||
} catch {
|
||||
// Probably not a git repository
|
||||
break exit_if_uncommitted_changes;
|
||||
}
|
||||
|
||||
if (!hasUncommittedChanges) {
|
||||
break exit_if_uncommitted_changes;
|
||||
}
|
||||
console.warn(
|
||||
[
|
||||
chalk.red(
|
||||
"Please commit or stash your changes before running this command.\n"
|
||||
),
|
||||
"This command will modify your project's files so it's better to have a clean working directory",
|
||||
"so that you can easily see what has been changed and revert if needed."
|
||||
].join(" ")
|
||||
);
|
||||
|
||||
process.exit(-1);
|
||||
}
|
||||
|
||||
const { value: accountThemeType } = await cliSelect({
|
||||
values: ["Single-Page" as const, "Multi-Page" as const]
|
||||
@ -76,7 +97,7 @@ export async function command(params: { buildContext: BuildContext }) {
|
||||
|
||||
updateAccountThemeImplementationInConfig({ buildContext, accountThemeType });
|
||||
|
||||
await updateKcGenCommand({
|
||||
await generateKcGenTs({
|
||||
buildContext: {
|
||||
...buildContext,
|
||||
implementedThemeTypes: {
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { relative as pathRelative, dirname as pathDirname } from "path";
|
||||
import { join as pathJoin, relative as pathRelative, dirname as pathDirname } from "path";
|
||||
import type { BuildContext } from "../shared/buildContext";
|
||||
import * as fs from "fs";
|
||||
import chalk from "chalk";
|
||||
@ -9,10 +9,12 @@ import {
|
||||
import { SemVer } from "../tools/SemVer";
|
||||
import fetch from "make-fetch-happen";
|
||||
import { z } from "zod";
|
||||
import { assert, type Equals, is } from "tsafe/assert";
|
||||
import { assert, type Equals } from "tsafe/assert";
|
||||
import { is } from "tsafe/is";
|
||||
import { id } from "tsafe/id";
|
||||
import { npmInstall } from "../tools/npmInstall";
|
||||
import { copyBoilerplate } from "./copyBoilerplate";
|
||||
import { getThisCodebaseRootDirPath } from "../tools/getThisCodebaseRootDirPath";
|
||||
|
||||
type BuildContextLike = BuildContextLike_getLatestsSemVersionedTag & {
|
||||
fetchOptions: BuildContext["fetchOptions"];
|
||||
@ -119,7 +121,20 @@ export async function initializeAccountTheme_singlePage(params: {
|
||||
JSON.stringify(parsedPackageJson, undefined, 4)
|
||||
);
|
||||
|
||||
npmInstall({ packageJsonDirPath: pathDirname(buildContext.packageJsonFilePath) });
|
||||
run_npm_install: {
|
||||
if (
|
||||
JSON.parse(
|
||||
fs
|
||||
.readFileSync(pathJoin(getThisCodebaseRootDirPath(), "package.json"))
|
||||
.toString("utf8")
|
||||
)["version"] === "0.0.0"
|
||||
) {
|
||||
//NOTE: Linked version
|
||||
break run_npm_install;
|
||||
}
|
||||
|
||||
npmInstall({ packageJsonDirPath: pathDirname(buildContext.packageJsonFilePath) });
|
||||
}
|
||||
|
||||
copyBoilerplate({
|
||||
accountThemeType: "Single-Page",
|
||||
|
||||
@ -1,12 +1,5 @@
|
||||
import { i18nBuilder } from "keycloakify/account";
|
||||
import type { ThemeName } from "../kc.gen";
|
||||
import { createUseI18n } from "keycloakify/account";
|
||||
|
||||
const { useI18n, ofTypeI18n } = i18nBuilder
|
||||
.withThemeName<ThemeName>()
|
||||
.withExtraLanguages({})
|
||||
.withCustomTranslations({})
|
||||
.build();
|
||||
export const { useI18n, ofTypeI18n } = createUseI18n({});
|
||||
|
||||
type I18n = typeof ofTypeI18n;
|
||||
|
||||
export { useI18n, type I18n };
|
||||
export type I18n = typeof ofTypeI18n;
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import { join as pathJoin } from "path";
|
||||
import { assert, type Equals, is } from "tsafe/assert";
|
||||
import { assert, type Equals } from "tsafe/assert";
|
||||
import type { BuildContext } from "../shared/buildContext";
|
||||
import * as fs from "fs";
|
||||
import chalk from "chalk";
|
||||
@ -8,14 +8,12 @@ import { id } from "tsafe/id";
|
||||
|
||||
export type BuildContextLike = {
|
||||
bundler: BuildContext["bundler"];
|
||||
projectDirPath: string;
|
||||
packageJsonFilePath: string;
|
||||
};
|
||||
|
||||
assert<BuildContext extends BuildContextLike ? true : false>();
|
||||
|
||||
export function updateAccountThemeImplementationInConfig(params: {
|
||||
buildContext: BuildContextLike;
|
||||
buildContext: BuildContext;
|
||||
accountThemeType: "Single-Page" | "Multi-Page";
|
||||
}) {
|
||||
const { buildContext, accountThemeType } = params;
|
||||
@ -83,8 +81,6 @@ export function updateAccountThemeImplementationInConfig(params: {
|
||||
|
||||
zParsedPackageJson.parse(parsedPackageJson);
|
||||
|
||||
assert(is<ParsedPackageJson>(parsedPackageJson));
|
||||
|
||||
return parsedPackageJson;
|
||||
})();
|
||||
|
||||
|
||||
@ -1,25 +1,15 @@
|
||||
import { join as pathJoin, relative as pathRelative } from "path";
|
||||
import { transformCodebase } from "./tools/transformCodebase";
|
||||
import { promptKeycloakVersion } from "./shared/promptKeycloakVersion";
|
||||
import type { BuildContext } from "./shared/buildContext";
|
||||
import { getBuildContext } from "./shared/buildContext";
|
||||
import * as fs from "fs";
|
||||
import type { CliCommandOptions } from "./main";
|
||||
import { downloadAndExtractArchive } from "./tools/downloadAndExtractArchive";
|
||||
import { maybeDelegateCommandToCustomHandler } from "./shared/customHandler_delegate";
|
||||
import fetch from "make-fetch-happen";
|
||||
import { SemVer } from "./tools/SemVer";
|
||||
import { assert } from "tsafe/assert";
|
||||
|
||||
export async function command(params: { buildContext: BuildContext }) {
|
||||
const { buildContext } = params;
|
||||
export async function command(params: { cliCommandOptions: CliCommandOptions }) {
|
||||
const { cliCommandOptions } = params;
|
||||
|
||||
const { hasBeenHandled } = maybeDelegateCommandToCustomHandler({
|
||||
commandName: "initialize-email-theme",
|
||||
buildContext
|
||||
});
|
||||
|
||||
if (hasBeenHandled) {
|
||||
return;
|
||||
}
|
||||
const buildContext = getBuildContext({ cliCommandOptions });
|
||||
|
||||
const emailThemeSrcDirPath = pathJoin(buildContext.themeSrcDirPath, "email");
|
||||
|
||||
@ -39,7 +29,7 @@ export async function command(params: { buildContext: BuildContext }) {
|
||||
|
||||
console.log("Initialize with the base email theme from which version of Keycloak?");
|
||||
|
||||
let { keycloakVersion } = await promptKeycloakVersion({
|
||||
const { keycloakVersion } = await promptKeycloakVersion({
|
||||
// NOTE: This is arbitrary
|
||||
startingFromMajor: 17,
|
||||
excludeMajorVersions: [],
|
||||
@ -47,32 +37,8 @@ export async function command(params: { buildContext: BuildContext }) {
|
||||
buildContext
|
||||
});
|
||||
|
||||
const getUrl = (keycloakVersion: string) => {
|
||||
return `https://repo1.maven.org/maven2/org/keycloak/keycloak-themes/${keycloakVersion}/keycloak-themes-${keycloakVersion}.jar`;
|
||||
};
|
||||
|
||||
keycloakVersion = await (async () => {
|
||||
const keycloakVersionParsed = SemVer.parse(keycloakVersion);
|
||||
|
||||
while (true) {
|
||||
const url = getUrl(SemVer.stringify(keycloakVersionParsed));
|
||||
|
||||
const response = await fetch(url, buildContext.fetchOptions);
|
||||
|
||||
if (response.ok) {
|
||||
break;
|
||||
}
|
||||
|
||||
assert(keycloakVersionParsed.patch !== 0);
|
||||
|
||||
keycloakVersionParsed.patch--;
|
||||
}
|
||||
|
||||
return SemVer.stringify(keycloakVersionParsed);
|
||||
})();
|
||||
|
||||
const { extractedDirPath } = await downloadAndExtractArchive({
|
||||
url: getUrl(keycloakVersion),
|
||||
url: `https://repo1.maven.org/maven2/org/keycloak/keycloak-themes/${keycloakVersion}/keycloak-themes-${keycloakVersion}.jar`,
|
||||
cacheDirPath: buildContext.cacheDirPath,
|
||||
fetchOptions: buildContext.fetchOptions,
|
||||
uniqueIdOfOnArchiveFile: "extractOnlyEmailTheme",
|
||||
|
||||
@ -16,7 +16,6 @@ import { isInside } from "../../tools/isInside";
|
||||
import child_process from "child_process";
|
||||
import { rmSync } from "../../tools/fs.rmSync";
|
||||
import { writeMetaInfKeycloakThemes } from "../../shared/metaInfKeycloakThemes";
|
||||
import { existsAsync } from "../../tools/fs.existsAsync";
|
||||
|
||||
export type BuildContextLike = BuildContextLike_generatePom & {
|
||||
keycloakifyBuildDirPath: string;
|
||||
@ -136,49 +135,40 @@ export async function buildJar(params: {
|
||||
break route_legacy_pages;
|
||||
}
|
||||
|
||||
await Promise.all(
|
||||
(["register.ftl", "login-update-profile.ftl"] as const)
|
||||
.map(pageId =>
|
||||
buildContext.themeNames.map(async themeName => {
|
||||
const ftlFilePath = pathJoin(
|
||||
tmpResourcesDirPath,
|
||||
"theme",
|
||||
themeName,
|
||||
"login",
|
||||
pageId
|
||||
);
|
||||
(["register.ftl", "login-update-profile.ftl"] as const).forEach(pageId =>
|
||||
buildContext.themeNames.map(themeName => {
|
||||
const ftlFilePath = pathJoin(
|
||||
tmpResourcesDirPath,
|
||||
"theme",
|
||||
themeName,
|
||||
"login",
|
||||
pageId
|
||||
);
|
||||
|
||||
// NOTE: https://github.com/keycloakify/keycloakify/issues/665
|
||||
if (!(await existsAsync(ftlFilePath))) {
|
||||
return;
|
||||
}
|
||||
const ftlFileContent = readFileSync(ftlFilePath).toString("utf8");
|
||||
|
||||
const ftlFileContent = readFileSync(ftlFilePath).toString("utf8");
|
||||
const ftlFileBasename = (() => {
|
||||
switch (pageId) {
|
||||
case "register.ftl":
|
||||
return "register-user-profile.ftl";
|
||||
case "login-update-profile.ftl":
|
||||
return "update-user-profile.ftl";
|
||||
}
|
||||
assert<Equals<typeof pageId, never>>(false);
|
||||
})();
|
||||
|
||||
const ftlFileBasename = (() => {
|
||||
switch (pageId) {
|
||||
case "register.ftl":
|
||||
return "register-user-profile.ftl";
|
||||
case "login-update-profile.ftl":
|
||||
return "update-user-profile.ftl";
|
||||
}
|
||||
assert<Equals<typeof pageId, never>>(false);
|
||||
})();
|
||||
const modifiedFtlFileContent = ftlFileContent.replace(
|
||||
`"ftlTemplateFileName": "${pageId}"`,
|
||||
`"ftlTemplateFileName": "${ftlFileBasename}"`
|
||||
);
|
||||
|
||||
const modifiedFtlFileContent = ftlFileContent.replace(
|
||||
`"ftlTemplateFileName": "${pageId}"`,
|
||||
`"ftlTemplateFileName": "${ftlFileBasename}"`
|
||||
);
|
||||
assert(modifiedFtlFileContent !== ftlFileContent);
|
||||
|
||||
assert(modifiedFtlFileContent !== ftlFileContent);
|
||||
|
||||
await fs.writeFile(
|
||||
pathJoin(pathDirname(ftlFilePath), ftlFileBasename),
|
||||
Buffer.from(modifiedFtlFileContent, "utf8")
|
||||
);
|
||||
})
|
||||
)
|
||||
.flat()
|
||||
fs.writeFile(
|
||||
pathJoin(pathDirname(ftlFilePath), ftlFileBasename),
|
||||
Buffer.from(modifiedFtlFileContent, "utf8")
|
||||
);
|
||||
})
|
||||
);
|
||||
}
|
||||
|
||||
@ -197,7 +187,7 @@ export async function buildJar(params: {
|
||||
|
||||
await new Promise<void>((resolve, reject) =>
|
||||
child_process.exec(
|
||||
`mvn clean install -Dmaven.repo.local="${pathJoin(keycloakifyBuildCacheDirPath, ".m2")}"`,
|
||||
`mvn install -Dmaven.repo.local="${pathJoin(keycloakifyBuildCacheDirPath, ".m2")}"`,
|
||||
{ cwd: keycloakifyBuildCacheDirPath },
|
||||
error => {
|
||||
if (error !== null) {
|
||||
|
||||
@ -87,17 +87,15 @@ attributes_to_attributesByName: {
|
||||
window.kcContext = kcContext;
|
||||
|
||||
<#if xKeycloakify.themeType == "login" >
|
||||
{
|
||||
const script = document.createElement("script");
|
||||
script.type = "importmap";
|
||||
script.textContent = JSON.stringify({
|
||||
imports: {
|
||||
"rfc4648": kcContext.url.resourcesCommonPath + "/node_modules/rfc4648/lib/rfc4648.js"
|
||||
}
|
||||
}, null, 2);
|
||||
const script = document.createElement("script");
|
||||
script.type = "importmap";
|
||||
script.textContent = JSON.stringify({
|
||||
imports: {
|
||||
"rfc4648": kcContext.url.resourcesCommonPath + "/node_modules/rfc4648/lib/rfc4648.js"
|
||||
}
|
||||
}, null, 2);
|
||||
|
||||
document.head.appendChild(script);
|
||||
}
|
||||
document.head.appendChild(script);
|
||||
</#if>
|
||||
|
||||
function decodeHtmlEntities(htmlStr){
|
||||
@ -166,8 +164,11 @@ function decodeHtmlEntities(htmlStr){
|
||||
areSamePath(path, []) &&
|
||||
["login-idp-link-confirm.ftl", "login-idp-link-email.ftl" ]?seq_contains(xKeycloakify.pageId)
|
||||
) || (
|
||||
["masterAdminClient", "delegateForUpdate", "defaultRole", "smtpConfig"]?seq_contains(key) &&
|
||||
["masterAdminClient", "delegateForUpdate", "defaultRole"]?seq_contains(key) &&
|
||||
areSamePath(path, ["realm"])
|
||||
) || (
|
||||
"smtpConfig" == key &&
|
||||
are_same_path(path, ["realm"])
|
||||
) || (
|
||||
xKeycloakify.pageId == "error.ftl" &&
|
||||
areSamePath(path, ["realm"]) &&
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
import { type ThemeType, FALLBACK_LANGUAGE_TAG } from "../../shared/constants";
|
||||
import { crawl } from "../../tools/crawl";
|
||||
import { join as pathJoin, dirname as pathDirname } from "path";
|
||||
import { join as pathJoin } from "path";
|
||||
import { symToStr } from "tsafe/symToStr";
|
||||
import * as recast from "recast";
|
||||
import * as babelParser from "@babel/parser";
|
||||
@ -10,27 +10,12 @@ import { escapeStringForPropertiesFile } from "../../tools/escapeStringForProper
|
||||
import { getThisCodebaseRootDirPath } from "../../tools/getThisCodebaseRootDirPath";
|
||||
import * as fs from "fs";
|
||||
import { assert } from "tsafe/assert";
|
||||
import type { BuildContext } from "../../shared/buildContext";
|
||||
import { getAbsoluteAndInOsFormatPath } from "../../tools/getAbsoluteAndInOsFormatPath";
|
||||
|
||||
export type BuildContextLike = {
|
||||
themeNames: string[];
|
||||
themeSrcDirPath: string;
|
||||
};
|
||||
|
||||
assert<BuildContext extends BuildContextLike ? true : false>();
|
||||
|
||||
export function generateMessageProperties(params: {
|
||||
buildContext: BuildContextLike;
|
||||
themeType: Exclude<ThemeType, "admin">;
|
||||
}): {
|
||||
languageTags: string[];
|
||||
writeMessagePropertiesFiles: (params: {
|
||||
messageDirPath: string;
|
||||
themeName: string;
|
||||
}) => void;
|
||||
} {
|
||||
const { buildContext, themeType } = params;
|
||||
themeSrcDirPath: string;
|
||||
themeType: ThemeType;
|
||||
}): { languageTag: string; propertiesFileSource: string }[] {
|
||||
const { themeSrcDirPath, themeType } = params;
|
||||
|
||||
const baseMessagesDirPath = pathJoin(
|
||||
getThisCodebaseRootDirPath(),
|
||||
@ -40,49 +25,51 @@ export function generateMessageProperties(params: {
|
||||
"messages_defaultSet"
|
||||
);
|
||||
|
||||
const messages_defaultSet_by_languageTag_defaultSet: {
|
||||
[languageTag_defaultSet: string]: Record<string, string>;
|
||||
} = Object.fromEntries(
|
||||
fs
|
||||
.readdirSync(baseMessagesDirPath)
|
||||
.filter(basename => basename !== "index.ts" && basename !== "types.ts")
|
||||
.map(basename => ({
|
||||
languageTag: basename.replace(/\.ts$/, ""),
|
||||
filePath: pathJoin(baseMessagesDirPath, basename)
|
||||
}))
|
||||
.map(({ languageTag, filePath }) => {
|
||||
const lines = fs.readFileSync(filePath).toString("utf8").split(/\r?\n/);
|
||||
const baseMessageBundle: { [languageTag: string]: Record<string, string> } =
|
||||
Object.fromEntries(
|
||||
fs
|
||||
.readdirSync(baseMessagesDirPath)
|
||||
.filter(baseName => baseName !== "index.ts")
|
||||
.map(basename => ({
|
||||
languageTag: basename.replace(/\.ts$/, ""),
|
||||
filePath: pathJoin(baseMessagesDirPath, basename)
|
||||
}))
|
||||
.map(({ languageTag, filePath }) => {
|
||||
const lines = fs
|
||||
.readFileSync(filePath)
|
||||
.toString("utf8")
|
||||
.split(/\r?\n/);
|
||||
|
||||
let messagesJson = "{";
|
||||
let messagesJson = "{";
|
||||
|
||||
let isInDeclaration = false;
|
||||
let isInDeclaration = false;
|
||||
|
||||
for (const line of lines) {
|
||||
if (!isInDeclaration) {
|
||||
if (line.startsWith("const messages")) {
|
||||
isInDeclaration = true;
|
||||
for (const line of lines) {
|
||||
if (!isInDeclaration) {
|
||||
if (line.startsWith("const messages")) {
|
||||
isInDeclaration = true;
|
||||
}
|
||||
|
||||
continue;
|
||||
}
|
||||
|
||||
continue;
|
||||
if (line.startsWith("}")) {
|
||||
messagesJson += "}";
|
||||
break;
|
||||
}
|
||||
|
||||
messagesJson += line;
|
||||
}
|
||||
|
||||
if (line.startsWith("}")) {
|
||||
messagesJson += "}";
|
||||
break;
|
||||
}
|
||||
const messages = JSON.parse(messagesJson) as Record<string, string>;
|
||||
|
||||
messagesJson += line;
|
||||
}
|
||||
|
||||
const messages = JSON.parse(messagesJson) as Record<string, string>;
|
||||
|
||||
return [languageTag, messages];
|
||||
})
|
||||
);
|
||||
return [languageTag, messages];
|
||||
})
|
||||
);
|
||||
|
||||
const { i18nTsFilePath } = (() => {
|
||||
let files = crawl({
|
||||
dirPath: pathJoin(buildContext.themeSrcDirPath, themeType),
|
||||
dirPath: pathJoin(themeSrcDirPath, themeType),
|
||||
returnedPathsType: "absolute"
|
||||
});
|
||||
|
||||
@ -101,7 +88,7 @@ export function generateMessageProperties(params: {
|
||||
files = files.sort((a, b) => a.length - b.length);
|
||||
|
||||
files = files.filter(file =>
|
||||
fs.readFileSync(file).toString("utf8").includes("i18nBuilder")
|
||||
fs.readFileSync(file).toString("utf8").includes("createUseI18n(")
|
||||
);
|
||||
|
||||
const i18nTsFilePath: string | undefined = files[0];
|
||||
@ -109,334 +96,97 @@ export function generateMessageProperties(params: {
|
||||
return { i18nTsFilePath };
|
||||
})();
|
||||
|
||||
const i18nTsRoot = (() => {
|
||||
if (i18nTsFilePath === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
const root = recastParseTs(i18nTsFilePath);
|
||||
return root;
|
||||
})();
|
||||
|
||||
const messages_defaultSet_by_languageTag_notInDefaultSet:
|
||||
| { [languageTag_notInDefaultSet: string]: Record<string, string> }
|
||||
| undefined = (() => {
|
||||
if (i18nTsRoot === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
let extraLanguageEntryByLanguageTag: Record<
|
||||
string,
|
||||
{ label: string; path: string }
|
||||
> = {};
|
||||
|
||||
recast.visit(i18nTsRoot, {
|
||||
visitCallExpression: function (path) {
|
||||
const node = path.node;
|
||||
|
||||
// Check if the callee is a MemberExpression with property 'withExtraLanguages'
|
||||
if (
|
||||
node.callee.type === "MemberExpression" &&
|
||||
node.callee.property.type === "Identifier" &&
|
||||
node.callee.property.name === "withExtraLanguages"
|
||||
) {
|
||||
const arg = node.arguments[0];
|
||||
if (arg && arg.type === "ObjectExpression") {
|
||||
// Iterate over the properties of the object
|
||||
arg.properties.forEach(prop => {
|
||||
if (
|
||||
prop.type === "ObjectProperty" &&
|
||||
prop.key.type === "Identifier"
|
||||
) {
|
||||
const lang = prop.key.name;
|
||||
const value = prop.value;
|
||||
|
||||
if (value.type === "ObjectExpression") {
|
||||
let label: string | undefined = undefined;
|
||||
let pathStr: string | undefined = undefined;
|
||||
|
||||
// Iterate over the properties of the language object
|
||||
value.properties.forEach(p => {
|
||||
if (
|
||||
p.type === "ObjectProperty" &&
|
||||
p.key.type === "Identifier"
|
||||
) {
|
||||
if (
|
||||
p.key.name === "label" &&
|
||||
p.value.type === "StringLiteral"
|
||||
) {
|
||||
label = p.value.value;
|
||||
}
|
||||
if (
|
||||
p.key.name === "getMessages" &&
|
||||
(p.value.type ===
|
||||
"ArrowFunctionExpression" ||
|
||||
p.value.type === "FunctionExpression")
|
||||
) {
|
||||
// Extract the import path from the function body
|
||||
const body = p.value.body;
|
||||
if (
|
||||
body.type === "CallExpression" &&
|
||||
body.callee.type === "Import"
|
||||
) {
|
||||
const importArg = body.arguments[0];
|
||||
if (
|
||||
importArg.type === "StringLiteral"
|
||||
) {
|
||||
pathStr = importArg.value;
|
||||
}
|
||||
} else if (
|
||||
body.type === "BlockStatement"
|
||||
) {
|
||||
// If the function body is a block (e.g., function with braces {})
|
||||
// Look for return statement
|
||||
body.body.forEach(statement => {
|
||||
if (
|
||||
statement.type ===
|
||||
"ReturnStatement" &&
|
||||
statement.argument &&
|
||||
statement.argument.type ===
|
||||
"CallExpression" &&
|
||||
statement.argument.callee
|
||||
.type === "Import"
|
||||
) {
|
||||
const importArg =
|
||||
statement.argument
|
||||
.arguments[0];
|
||||
if (
|
||||
importArg.type ===
|
||||
"StringLiteral"
|
||||
) {
|
||||
pathStr = importArg.value;
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
if (label && pathStr) {
|
||||
extraLanguageEntryByLanguageTag[lang] = {
|
||||
label,
|
||||
path: pathStr
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return false; // Stop traversing this path
|
||||
}
|
||||
|
||||
this.traverse(path); // Continue traversing other paths
|
||||
const messageBundle: { [languageTag: string]: Record<string, string> } | undefined =
|
||||
(() => {
|
||||
if (i18nTsFilePath === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
});
|
||||
|
||||
const messages_defaultSet_by_languageTag_notInDefaultSet = Object.fromEntries(
|
||||
Object.entries(extraLanguageEntryByLanguageTag).map(
|
||||
([languageTag, { path: relativePathWithoutExt }]) => [
|
||||
languageTag,
|
||||
(() => {
|
||||
const filePath = getAbsoluteAndInOsFormatPath({
|
||||
pathIsh: relativePathWithoutExt.endsWith(".ts")
|
||||
? relativePathWithoutExt
|
||||
: `${relativePathWithoutExt}.ts`,
|
||||
cwd: pathDirname(i18nTsFilePath)
|
||||
});
|
||||
|
||||
const root = recastParseTs(filePath);
|
||||
|
||||
let declarationCode: string | undefined = "";
|
||||
|
||||
recast.visit(root, {
|
||||
visitVariableDeclarator: function (path) {
|
||||
const node = path.node;
|
||||
|
||||
// Check if the variable name is 'messages'
|
||||
if (
|
||||
node.id.type === "Identifier" &&
|
||||
node.id.name === "messages"
|
||||
) {
|
||||
// Ensure there is an initializer
|
||||
if (node.init) {
|
||||
// Generate code from the initializer, preserving comments
|
||||
declarationCode = recast
|
||||
.print(node.init)
|
||||
.code.replace(/}.*$/, "}");
|
||||
}
|
||||
return false; // Stop traversing this path
|
||||
}
|
||||
|
||||
this.traverse(path); // Continue traversing other paths
|
||||
}
|
||||
});
|
||||
|
||||
assert(
|
||||
declarationCode !== undefined,
|
||||
`${filePath} does not contain a 'messages' variable declaration`
|
||||
);
|
||||
|
||||
let messages: Record<string, string> = {};
|
||||
|
||||
try {
|
||||
eval(`${symToStr({ messages })} = ${declarationCode};`);
|
||||
} catch {
|
||||
throw new Error(
|
||||
`The declaration of 'message' in ${filePath} cannot be statically evaluated: ${declarationCode}`
|
||||
);
|
||||
}
|
||||
|
||||
return messages;
|
||||
})()
|
||||
]
|
||||
)
|
||||
);
|
||||
|
||||
return messages_defaultSet_by_languageTag_notInDefaultSet;
|
||||
})();
|
||||
|
||||
const messages_defaultSet_by_languageTag = {
|
||||
...messages_defaultSet_by_languageTag_defaultSet,
|
||||
...messages_defaultSet_by_languageTag_notInDefaultSet
|
||||
};
|
||||
|
||||
const messages_themeDefined_by_languageTag:
|
||||
| {
|
||||
[languageTag: string]:
|
||||
| Record<string, string | Record<string, string>>
|
||||
| undefined;
|
||||
}
|
||||
| undefined = (() => {
|
||||
if (i18nTsRoot === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
let firstArgumentCode: string | undefined = undefined;
|
||||
|
||||
recast.visit(i18nTsRoot, {
|
||||
visitCallExpression: function (path) {
|
||||
const node = path.node;
|
||||
|
||||
if (
|
||||
node.callee.type === "MemberExpression" &&
|
||||
node.callee.property.type === "Identifier" &&
|
||||
node.callee.property.name === "withCustomTranslations"
|
||||
) {
|
||||
firstArgumentCode = babelGenerate(node.arguments[0] as any).code;
|
||||
return false;
|
||||
const root = recast.parse(fs.readFileSync(i18nTsFilePath).toString("utf8"), {
|
||||
parser: {
|
||||
parse: (code: string) =>
|
||||
babelParser.parse(code, {
|
||||
sourceType: "module",
|
||||
plugins: ["typescript"]
|
||||
}),
|
||||
generator: babelGenerate,
|
||||
types: babelTypes
|
||||
}
|
||||
});
|
||||
|
||||
this.traverse(path);
|
||||
}
|
||||
});
|
||||
let messageBundleDeclarationTsCode: string | undefined = undefined;
|
||||
|
||||
if (firstArgumentCode === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
let messages_themeDefined_by_languageTag: {
|
||||
[languageTag: string]: Record<string, string | Record<string, string>>;
|
||||
} = {};
|
||||
|
||||
try {
|
||||
eval(
|
||||
`${symToStr({ messages_themeDefined_by_languageTag })} = ${firstArgumentCode}`
|
||||
);
|
||||
} catch {
|
||||
console.warn(
|
||||
[
|
||||
"WARNING: The argument of withCustomTranslations can't be statically evaluated!",
|
||||
"This needs to be fixed refer to the documentation: https://docs.keycloakify.dev/i18n",
|
||||
firstArgumentCode
|
||||
].join(" ")
|
||||
);
|
||||
return undefined;
|
||||
}
|
||||
|
||||
return messages_themeDefined_by_languageTag;
|
||||
})();
|
||||
|
||||
const languageTags = Object.keys(messages_defaultSet_by_languageTag);
|
||||
|
||||
return {
|
||||
languageTags,
|
||||
writeMessagePropertiesFiles: ({ messageDirPath, themeName }) => {
|
||||
for (const languageTag of languageTags) {
|
||||
const messages = {
|
||||
...messages_defaultSet_by_languageTag[languageTag]
|
||||
};
|
||||
|
||||
add_theme_defined_messages: {
|
||||
if (messages_themeDefined_by_languageTag === undefined) {
|
||||
break add_theme_defined_messages;
|
||||
recast.visit(root, {
|
||||
visitCallExpression: function (path) {
|
||||
if (
|
||||
path.node.callee.type === "Identifier" &&
|
||||
path.node.callee.name === "createUseI18n"
|
||||
) {
|
||||
messageBundleDeclarationTsCode = babelGenerate(
|
||||
path.node.arguments[0] as any
|
||||
).code;
|
||||
return false;
|
||||
}
|
||||
|
||||
let messages_themeDefined =
|
||||
messages_themeDefined_by_languageTag[languageTag];
|
||||
|
||||
if (messages_themeDefined === undefined) {
|
||||
messages_themeDefined =
|
||||
messages_themeDefined_by_languageTag[FALLBACK_LANGUAGE_TAG];
|
||||
}
|
||||
if (messages_themeDefined === undefined) {
|
||||
messages_themeDefined =
|
||||
messages_themeDefined_by_languageTag[
|
||||
Object.keys(messages_themeDefined_by_languageTag)[0]
|
||||
];
|
||||
}
|
||||
if (messages_themeDefined === undefined) {
|
||||
break add_theme_defined_messages;
|
||||
}
|
||||
|
||||
for (const [key, messageOrMessageByThemeName] of Object.entries(
|
||||
messages_themeDefined
|
||||
)) {
|
||||
const message = (() => {
|
||||
if (typeof messageOrMessageByThemeName === "string") {
|
||||
return messageOrMessageByThemeName;
|
||||
}
|
||||
|
||||
const message = messageOrMessageByThemeName[themeName];
|
||||
|
||||
assert(message !== undefined);
|
||||
|
||||
return message;
|
||||
})();
|
||||
|
||||
messages[key] = message;
|
||||
}
|
||||
this.traverse(path);
|
||||
}
|
||||
});
|
||||
|
||||
const propertiesFileSource = [
|
||||
"",
|
||||
...Object.entries(messages).map(
|
||||
([key, value]) => `${key}=${escapeStringForPropertiesFile(value)}`
|
||||
),
|
||||
""
|
||||
].join("\n");
|
||||
assert(messageBundleDeclarationTsCode !== undefined);
|
||||
|
||||
fs.mkdirSync(messageDirPath, { recursive: true });
|
||||
let messageBundle: {
|
||||
[languageTag: string]: Record<string, string>;
|
||||
} = {};
|
||||
|
||||
fs.writeFileSync(
|
||||
pathJoin(messageDirPath, `messages_${languageTag}.properties`),
|
||||
Buffer.from(propertiesFileSource, "utf8")
|
||||
try {
|
||||
eval(
|
||||
`${symToStr({ messageBundle })} = ${messageBundleDeclarationTsCode}`
|
||||
);
|
||||
} catch {
|
||||
console.warn(
|
||||
[
|
||||
"WARNING: Make sure the messageBundle your provided as argument of createUseI18n can be statically evaluated.",
|
||||
"This is important because we need to put your i18n messages in messages_*.properties files",
|
||||
"or they won't be available server side.",
|
||||
"\n",
|
||||
"The following code could not be evaluated:",
|
||||
"\n",
|
||||
messageBundleDeclarationTsCode
|
||||
].join(" ")
|
||||
);
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function recastParseTs(filePath: string): recast.types.ASTNode {
|
||||
return recast.parse(fs.readFileSync(filePath).toString("utf8"), {
|
||||
parser: {
|
||||
parse: (code: string) =>
|
||||
babelParser.parse(code, {
|
||||
sourceType: "module",
|
||||
plugins: ["typescript"]
|
||||
}),
|
||||
generator: babelGenerate,
|
||||
types: babelTypes
|
||||
}
|
||||
});
|
||||
return messageBundle;
|
||||
})();
|
||||
|
||||
const mergedMessageBundle: { [languageTag: string]: Record<string, string> } =
|
||||
Object.fromEntries(
|
||||
Object.entries(baseMessageBundle).map(([languageTag, messages]) => [
|
||||
languageTag,
|
||||
{
|
||||
...messages,
|
||||
...(messageBundle === undefined
|
||||
? {}
|
||||
: messageBundle[languageTag] ??
|
||||
messageBundle[FALLBACK_LANGUAGE_TAG] ??
|
||||
messageBundle[Object.keys(messageBundle)[0]] ??
|
||||
{})
|
||||
}
|
||||
])
|
||||
);
|
||||
|
||||
const messageProperties: { languageTag: string; propertiesFileSource: string }[] =
|
||||
Object.entries(mergedMessageBundle).map(([languageTag, messages]) => ({
|
||||
languageTag,
|
||||
propertiesFileSource: [
|
||||
"",
|
||||
...(themeType !== "account" ? ["parent=base"] : []),
|
||||
...Object.entries(messages).map(
|
||||
([key, value]) => `${key}=${escapeStringForPropertiesFile(value)}`
|
||||
),
|
||||
""
|
||||
].join("\n")
|
||||
}));
|
||||
|
||||
return messageProperties;
|
||||
}
|
||||
|
||||
@ -1,57 +1,16 @@
|
||||
import type { BuildContext } from "../../shared/buildContext";
|
||||
import { assert } from "tsafe/assert";
|
||||
import {
|
||||
generateResourcesForMainTheme,
|
||||
type BuildContextLike as BuildContextLike_generateResourcesForMainTheme
|
||||
} from "./generateResourcesForMainTheme";
|
||||
import { generateResourcesForThemeVariant } from "./generateResourcesForThemeVariant";
|
||||
import fs from "fs";
|
||||
import { rmSync } from "../../tools/fs.rmSync";
|
||||
import { transformCodebase } from "../../tools/transformCodebase";
|
||||
import {
|
||||
join as pathJoin,
|
||||
relative as pathRelative,
|
||||
dirname as pathDirname,
|
||||
extname as pathExtname,
|
||||
sep as pathSep
|
||||
} from "path";
|
||||
import { replaceImportsInJsCode } from "../replacers/replaceImportsInJsCode";
|
||||
import { replaceImportsInCssCode } from "../replacers/replaceImportsInCssCode";
|
||||
import {
|
||||
generateFtlFilesCodeFactory,
|
||||
type BuildContextLike as BuildContextLike_kcContextExclusionsFtlCode
|
||||
} from "../generateFtl";
|
||||
import {
|
||||
type ThemeType,
|
||||
LOGIN_THEME_PAGE_IDS,
|
||||
ACCOUNT_THEME_PAGE_IDS,
|
||||
WELL_KNOWN_DIRECTORY_BASE_NAME,
|
||||
THEME_TYPES
|
||||
} from "../../shared/constants";
|
||||
import { assert, type Equals } from "tsafe/assert";
|
||||
import { readFieldNameUsage } from "./readFieldNameUsage";
|
||||
import { readExtraPagesNames } from "./readExtraPageNames";
|
||||
import {
|
||||
generateMessageProperties,
|
||||
type BuildContextLike as BuildContextLike_generateMessageProperties
|
||||
} from "./generateMessageProperties";
|
||||
import { readThisNpmPackageVersion } from "../../tools/readThisNpmPackageVersion";
|
||||
import {
|
||||
writeMetaInfKeycloakThemes,
|
||||
type MetaInfKeycloakTheme
|
||||
} from "../../shared/metaInfKeycloakThemes";
|
||||
import { objectEntries } from "tsafe/objectEntries";
|
||||
import { escapeStringForPropertiesFile } from "../../tools/escapeStringForPropertiesFile";
|
||||
import * as child_process from "child_process";
|
||||
import { getThisCodebaseRootDirPath } from "../../tools/getThisCodebaseRootDirPath";
|
||||
import propertiesParser from "properties-parser";
|
||||
|
||||
export type BuildContextLike = BuildContextLike_kcContextExclusionsFtlCode &
|
||||
BuildContextLike_generateMessageProperties & {
|
||||
themeNames: string[];
|
||||
extraThemeProperties: string[] | undefined;
|
||||
projectDirPath: string;
|
||||
projectBuildDirPath: string;
|
||||
environmentVariables: { name: string; default: string }[];
|
||||
implementedThemeTypes: BuildContext["implementedThemeTypes"];
|
||||
themeSrcDirPath: string;
|
||||
bundler: "vite" | "webpack";
|
||||
packageJsonFilePath: string;
|
||||
};
|
||||
export type BuildContextLike = BuildContextLike_generateResourcesForMainTheme & {
|
||||
themeNames: string[];
|
||||
};
|
||||
|
||||
assert<BuildContext extends BuildContextLike ? true : false>();
|
||||
|
||||
@ -61,474 +20,23 @@ export async function generateResources(params: {
|
||||
}): Promise<void> {
|
||||
const { resourcesDirPath, buildContext } = params;
|
||||
|
||||
const [themeName] = buildContext.themeNames;
|
||||
const [themeName, ...themeVariantNames] = buildContext.themeNames;
|
||||
|
||||
if (fs.existsSync(resourcesDirPath)) {
|
||||
rmSync(resourcesDirPath, { recursive: true });
|
||||
}
|
||||
|
||||
const getThemeTypeDirPath = (params: {
|
||||
themeType: ThemeType | "email";
|
||||
themeName: string;
|
||||
}) => {
|
||||
const { themeType, themeName } = params;
|
||||
return pathJoin(resourcesDirPath, "theme", themeName, themeType);
|
||||
};
|
||||
await generateResourcesForMainTheme({
|
||||
resourcesDirPath,
|
||||
themeName,
|
||||
buildContext
|
||||
});
|
||||
|
||||
const writeMessagePropertiesFilesByThemeType: Partial<
|
||||
Record<ThemeType, (params: { messageDirPath: string; themeName: string }) => void>
|
||||
> = {};
|
||||
|
||||
for (const themeType of THEME_TYPES) {
|
||||
if (!buildContext.implementedThemeTypes[themeType].isImplemented) {
|
||||
continue;
|
||||
}
|
||||
|
||||
const getAccountThemeType = () => {
|
||||
assert(themeType === "account");
|
||||
|
||||
assert(buildContext.implementedThemeTypes.account.isImplemented);
|
||||
|
||||
return buildContext.implementedThemeTypes.account.type;
|
||||
};
|
||||
|
||||
const isSpa = (() => {
|
||||
switch (themeType) {
|
||||
case "login":
|
||||
return false;
|
||||
case "account":
|
||||
return getAccountThemeType() === "Single-Page";
|
||||
case "admin":
|
||||
return true;
|
||||
}
|
||||
})();
|
||||
|
||||
const themeTypeDirPath = getThemeTypeDirPath({ themeName, themeType });
|
||||
|
||||
apply_replacers_and_move_to_theme_resources: {
|
||||
const destDirPath = pathJoin(
|
||||
themeTypeDirPath,
|
||||
"resources",
|
||||
WELL_KNOWN_DIRECTORY_BASE_NAME.DIST
|
||||
);
|
||||
|
||||
// NOTE: Prevent accumulation of files in the assets dir, as names are hashed they pile up.
|
||||
rmSync(destDirPath, { recursive: true, force: true });
|
||||
|
||||
if (
|
||||
themeType !== "login" &&
|
||||
buildContext.implementedThemeTypes.login.isImplemented
|
||||
) {
|
||||
// NOTE: We prevent doing it twice, it has been done for the login theme.
|
||||
|
||||
transformCodebase({
|
||||
srcDirPath: pathJoin(
|
||||
getThemeTypeDirPath({
|
||||
themeName,
|
||||
themeType: "login"
|
||||
}),
|
||||
"resources",
|
||||
WELL_KNOWN_DIRECTORY_BASE_NAME.DIST
|
||||
),
|
||||
destDirPath
|
||||
});
|
||||
|
||||
break apply_replacers_and_move_to_theme_resources;
|
||||
}
|
||||
|
||||
{
|
||||
const dirPath = pathJoin(
|
||||
buildContext.projectBuildDirPath,
|
||||
WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES
|
||||
);
|
||||
|
||||
if (fs.existsSync(dirPath)) {
|
||||
assert(buildContext.bundler === "webpack");
|
||||
|
||||
throw new Error(
|
||||
[
|
||||
`Keycloakify build error: The ${WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES} directory shouldn't exist in your build directory.`,
|
||||
`(${pathRelative(process.cwd(), dirPath)}).\n`,
|
||||
`Theses assets are only required for local development with Storybook.",
|
||||
"Please remove this directory as an additional step of your command.\n`,
|
||||
`For example: \`"build": "... && rimraf ${pathRelative(buildContext.projectDirPath, dirPath)}"\``
|
||||
].join(" ")
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
transformCodebase({
|
||||
srcDirPath: buildContext.projectBuildDirPath,
|
||||
destDirPath,
|
||||
transformSourceCode: ({ filePath, fileRelativePath, sourceCode }) => {
|
||||
if (filePath.endsWith(".css")) {
|
||||
const { fixedCssCode } = replaceImportsInCssCode({
|
||||
cssCode: sourceCode.toString("utf8"),
|
||||
cssFileRelativeDirPath: pathDirname(fileRelativePath),
|
||||
buildContext
|
||||
});
|
||||
|
||||
return {
|
||||
modifiedSourceCode: Buffer.from(fixedCssCode, "utf8")
|
||||
};
|
||||
}
|
||||
|
||||
if (filePath.endsWith(".js")) {
|
||||
const { fixedJsCode } = replaceImportsInJsCode({
|
||||
jsCode: sourceCode.toString("utf8"),
|
||||
buildContext
|
||||
});
|
||||
|
||||
return {
|
||||
modifiedSourceCode: Buffer.from(fixedJsCode, "utf8")
|
||||
};
|
||||
}
|
||||
|
||||
return { modifiedSourceCode: sourceCode };
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
const { generateFtlFilesCode } = generateFtlFilesCodeFactory({
|
||||
themeName,
|
||||
indexHtmlCode: fs
|
||||
.readFileSync(pathJoin(buildContext.projectBuildDirPath, "index.html"))
|
||||
.toString("utf8"),
|
||||
buildContext,
|
||||
keycloakifyVersion: readThisNpmPackageVersion(),
|
||||
themeType,
|
||||
fieldNames: isSpa
|
||||
? []
|
||||
: (assert(themeType !== "admin"),
|
||||
readFieldNameUsage({
|
||||
themeSrcDirPath: buildContext.themeSrcDirPath,
|
||||
themeType
|
||||
}))
|
||||
});
|
||||
|
||||
[
|
||||
...(() => {
|
||||
switch (themeType) {
|
||||
case "login":
|
||||
return LOGIN_THEME_PAGE_IDS;
|
||||
case "account":
|
||||
return getAccountThemeType() === "Single-Page"
|
||||
? ["index.ftl"]
|
||||
: ACCOUNT_THEME_PAGE_IDS;
|
||||
case "admin":
|
||||
return ["index.ftl"];
|
||||
}
|
||||
})(),
|
||||
...(isSpa
|
||||
? []
|
||||
: readExtraPagesNames({
|
||||
themeType,
|
||||
themeSrcDirPath: buildContext.themeSrcDirPath
|
||||
}))
|
||||
].forEach(pageId => {
|
||||
const { ftlCode } = generateFtlFilesCode({ pageId });
|
||||
|
||||
fs.writeFileSync(
|
||||
pathJoin(themeTypeDirPath, pageId),
|
||||
Buffer.from(ftlCode, "utf8")
|
||||
);
|
||||
});
|
||||
|
||||
let languageTags: string[] | undefined = undefined;
|
||||
|
||||
i18n_messages_generation: {
|
||||
if (isSpa) {
|
||||
break i18n_messages_generation;
|
||||
}
|
||||
|
||||
assert(themeType !== "admin");
|
||||
|
||||
const wrap = generateMessageProperties({
|
||||
buildContext,
|
||||
themeType
|
||||
});
|
||||
|
||||
languageTags = wrap.languageTags;
|
||||
const { writeMessagePropertiesFiles } = wrap;
|
||||
|
||||
writeMessagePropertiesFilesByThemeType[themeType] =
|
||||
writeMessagePropertiesFiles;
|
||||
}
|
||||
|
||||
bring_in_spas_messages: {
|
||||
if (!isSpa) {
|
||||
break bring_in_spas_messages;
|
||||
}
|
||||
|
||||
assert(themeType !== "login");
|
||||
|
||||
const accountUiDirPath = child_process
|
||||
.execSync(`npm list @keycloakify/keycloak-${themeType}-ui --parseable`, {
|
||||
cwd: pathDirname(buildContext.packageJsonFilePath)
|
||||
})
|
||||
.toString("utf8")
|
||||
.trim();
|
||||
|
||||
const messageDirPath_defaults = pathJoin(accountUiDirPath, "messages");
|
||||
|
||||
if (!fs.existsSync(messageDirPath_defaults)) {
|
||||
throw new Error(
|
||||
`Please update @keycloakify/keycloak-account-ui to 25.0.4-rc.5 or later.`
|
||||
);
|
||||
}
|
||||
|
||||
const messagesDirPath_dest = pathJoin(
|
||||
getThemeTypeDirPath({ themeName, themeType }),
|
||||
"messages"
|
||||
);
|
||||
|
||||
transformCodebase({
|
||||
srcDirPath: messageDirPath_defaults,
|
||||
destDirPath: messagesDirPath_dest
|
||||
});
|
||||
|
||||
apply_theme_changes: {
|
||||
const messagesDirPath_theme = pathJoin(
|
||||
buildContext.themeSrcDirPath,
|
||||
themeType,
|
||||
"messages"
|
||||
);
|
||||
|
||||
if (!fs.existsSync(messagesDirPath_theme)) {
|
||||
break apply_theme_changes;
|
||||
}
|
||||
|
||||
fs.readdirSync(messagesDirPath_theme).forEach(basename => {
|
||||
const filePath_src = pathJoin(messagesDirPath_theme, basename);
|
||||
const filePath_dest = pathJoin(messagesDirPath_dest, basename);
|
||||
|
||||
if (!fs.existsSync(filePath_dest)) {
|
||||
fs.cpSync(filePath_src, filePath_dest);
|
||||
}
|
||||
|
||||
const messages_src = propertiesParser.parse(
|
||||
fs.readFileSync(filePath_src).toString("utf8")
|
||||
);
|
||||
const messages_dest = propertiesParser.parse(
|
||||
fs.readFileSync(filePath_dest).toString("utf8")
|
||||
);
|
||||
|
||||
const messages = {
|
||||
...messages_dest,
|
||||
...messages_src
|
||||
};
|
||||
|
||||
const editor = propertiesParser.createEditor();
|
||||
|
||||
Object.entries(messages).forEach(([key, value]) => {
|
||||
editor.set(key, value);
|
||||
});
|
||||
|
||||
fs.writeFileSync(
|
||||
filePath_dest,
|
||||
Buffer.from(editor.toString(), "utf8")
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
languageTags = fs
|
||||
.readdirSync(messagesDirPath_dest)
|
||||
.map(basename =>
|
||||
basename.replace(/^messages_/, "").replace(/\.properties$/, "")
|
||||
);
|
||||
}
|
||||
|
||||
keycloak_static_resources: {
|
||||
if (isSpa) {
|
||||
break keycloak_static_resources;
|
||||
}
|
||||
|
||||
transformCodebase({
|
||||
srcDirPath: pathJoin(
|
||||
getThisCodebaseRootDirPath(),
|
||||
"res",
|
||||
"public",
|
||||
WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES,
|
||||
themeType
|
||||
),
|
||||
destDirPath: pathJoin(themeTypeDirPath, "resources")
|
||||
});
|
||||
}
|
||||
|
||||
fs.writeFileSync(
|
||||
pathJoin(themeTypeDirPath, "theme.properties"),
|
||||
Buffer.from(
|
||||
[
|
||||
`parent=${(() => {
|
||||
switch (themeType) {
|
||||
case "account":
|
||||
switch (getAccountThemeType()) {
|
||||
case "Multi-Page":
|
||||
return "account-v1";
|
||||
case "Single-Page":
|
||||
return "base";
|
||||
}
|
||||
case "login":
|
||||
return "keycloak";
|
||||
case "admin":
|
||||
return "base";
|
||||
}
|
||||
assert<Equals<typeof themeType, never>>(false);
|
||||
})()}`,
|
||||
...(themeType === "account" && getAccountThemeType() === "Single-Page"
|
||||
? ["deprecatedMode=false"]
|
||||
: []),
|
||||
...(buildContext.extraThemeProperties ?? []),
|
||||
...buildContext.environmentVariables.map(
|
||||
({ name, default: defaultValue }) =>
|
||||
`${name}=\${env.${name}:${escapeStringForPropertiesFile(defaultValue)}}`
|
||||
),
|
||||
...(languageTags === undefined
|
||||
? []
|
||||
: [`locales=${languageTags.join(",")}`])
|
||||
].join("\n\n"),
|
||||
"utf8"
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
email: {
|
||||
if (!buildContext.implementedThemeTypes.email.isImplemented) {
|
||||
break email;
|
||||
}
|
||||
|
||||
const emailThemeSrcDirPath = pathJoin(buildContext.themeSrcDirPath, "email");
|
||||
|
||||
transformCodebase({
|
||||
srcDirPath: emailThemeSrcDirPath,
|
||||
destDirPath: getThemeTypeDirPath({ themeName, themeType: "email" })
|
||||
});
|
||||
}
|
||||
|
||||
bring_in_account_v1: {
|
||||
if (!buildContext.implementedThemeTypes.account.isImplemented) {
|
||||
break bring_in_account_v1;
|
||||
}
|
||||
|
||||
if (buildContext.implementedThemeTypes.account.type !== "Multi-Page") {
|
||||
break bring_in_account_v1;
|
||||
}
|
||||
|
||||
transformCodebase({
|
||||
srcDirPath: pathJoin(getThisCodebaseRootDirPath(), "res", "account-v1"),
|
||||
destDirPath: getThemeTypeDirPath({
|
||||
themeName: "account-v1",
|
||||
themeType: "account"
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
{
|
||||
const metaInfKeycloakThemes: MetaInfKeycloakTheme = { themes: [] };
|
||||
|
||||
for (const themeName of buildContext.themeNames) {
|
||||
metaInfKeycloakThemes.themes.push({
|
||||
name: themeName,
|
||||
types: objectEntries(buildContext.implementedThemeTypes)
|
||||
.filter(([, { isImplemented }]) => isImplemented)
|
||||
.map(([themeType]) => themeType)
|
||||
});
|
||||
}
|
||||
|
||||
if (buildContext.implementedThemeTypes.account.isImplemented) {
|
||||
metaInfKeycloakThemes.themes.push({
|
||||
name: "account-v1",
|
||||
types: ["account"]
|
||||
});
|
||||
}
|
||||
|
||||
writeMetaInfKeycloakThemes({
|
||||
for (const themeVariantName of themeVariantNames) {
|
||||
generateResourcesForThemeVariant({
|
||||
resourcesDirPath,
|
||||
getNewMetaInfKeycloakTheme: () => metaInfKeycloakThemes
|
||||
themeName,
|
||||
themeVariantName
|
||||
});
|
||||
}
|
||||
|
||||
for (const themeVariantName of buildContext.themeNames) {
|
||||
if (themeVariantName === themeName) {
|
||||
continue;
|
||||
}
|
||||
|
||||
transformCodebase({
|
||||
srcDirPath: pathJoin(resourcesDirPath, "theme", themeName),
|
||||
destDirPath: pathJoin(resourcesDirPath, "theme", themeVariantName),
|
||||
transformSourceCode: ({ fileRelativePath, sourceCode }) => {
|
||||
if (
|
||||
pathExtname(fileRelativePath) === ".ftl" &&
|
||||
fileRelativePath.split(pathSep).length === 2
|
||||
) {
|
||||
const modifiedSourceCode = Buffer.from(
|
||||
Buffer.from(sourceCode)
|
||||
.toString("utf-8")
|
||||
.replace(
|
||||
`"themeName": "${themeName}"`,
|
||||
`"themeName": "${themeVariantName}"`
|
||||
),
|
||||
"utf8"
|
||||
);
|
||||
|
||||
assert(Buffer.compare(modifiedSourceCode, sourceCode) !== 0);
|
||||
|
||||
return { modifiedSourceCode };
|
||||
}
|
||||
|
||||
return { modifiedSourceCode: sourceCode };
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
for (const themeName of buildContext.themeNames) {
|
||||
for (const [themeType, writeMessagePropertiesFiles] of objectEntries(
|
||||
writeMessagePropertiesFilesByThemeType
|
||||
)) {
|
||||
// NOTE: This is just a quirk of the type system: We can't really differentiate in a record
|
||||
// between the case where the key isn't present and the case where the value is `undefined`.
|
||||
if (writeMessagePropertiesFiles === undefined) {
|
||||
return;
|
||||
}
|
||||
writeMessagePropertiesFiles({
|
||||
messageDirPath: pathJoin(
|
||||
getThemeTypeDirPath({ themeName, themeType }),
|
||||
"messages"
|
||||
),
|
||||
themeName
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
modify_email_theme_per_variant: {
|
||||
if (!buildContext.implementedThemeTypes.email.isImplemented) {
|
||||
break modify_email_theme_per_variant;
|
||||
}
|
||||
|
||||
for (const themeName of buildContext.themeNames) {
|
||||
const emailThemeDirPath = getThemeTypeDirPath({
|
||||
themeName,
|
||||
themeType: "email"
|
||||
});
|
||||
|
||||
transformCodebase({
|
||||
srcDirPath: emailThemeDirPath,
|
||||
destDirPath: emailThemeDirPath,
|
||||
transformSourceCode: ({ filePath, sourceCode }) => {
|
||||
if (!filePath.endsWith(".ftl")) {
|
||||
return { modifiedSourceCode: sourceCode };
|
||||
}
|
||||
|
||||
return {
|
||||
modifiedSourceCode: Buffer.from(
|
||||
sourceCode
|
||||
.toString("utf8")
|
||||
.replace(/xKeycloakify\.themeName/g, `"${themeName}"`),
|
||||
"utf8"
|
||||
)
|
||||
};
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -0,0 +1,341 @@
|
||||
import { transformCodebase } from "../../tools/transformCodebase";
|
||||
import * as fs from "fs";
|
||||
import { join as pathJoin, relative as pathRelative, dirname as pathDirname } from "path";
|
||||
import { replaceImportsInJsCode } from "../replacers/replaceImportsInJsCode";
|
||||
import { replaceImportsInCssCode } from "../replacers/replaceImportsInCssCode";
|
||||
import {
|
||||
generateFtlFilesCodeFactory,
|
||||
type BuildContextLike as BuildContextLike_kcContextExclusionsFtlCode
|
||||
} from "../generateFtl";
|
||||
import {
|
||||
type ThemeType,
|
||||
LOGIN_THEME_PAGE_IDS,
|
||||
ACCOUNT_THEME_PAGE_IDS,
|
||||
WELL_KNOWN_DIRECTORY_BASE_NAME
|
||||
} from "../../shared/constants";
|
||||
import type { BuildContext } from "../../shared/buildContext";
|
||||
import { assert, type Equals } from "tsafe/assert";
|
||||
import { readFieldNameUsage } from "./readFieldNameUsage";
|
||||
import { readExtraPagesNames } from "./readExtraPageNames";
|
||||
import { generateMessageProperties } from "./generateMessageProperties";
|
||||
import { rmSync } from "../../tools/fs.rmSync";
|
||||
import { readThisNpmPackageVersion } from "../../tools/readThisNpmPackageVersion";
|
||||
import {
|
||||
writeMetaInfKeycloakThemes,
|
||||
type MetaInfKeycloakTheme
|
||||
} from "../../shared/metaInfKeycloakThemes";
|
||||
import { objectEntries } from "tsafe/objectEntries";
|
||||
import { escapeStringForPropertiesFile } from "../../tools/escapeStringForPropertiesFile";
|
||||
import * as child_process from "child_process";
|
||||
import { getThisCodebaseRootDirPath } from "../../tools/getThisCodebaseRootDirPath";
|
||||
|
||||
export type BuildContextLike = BuildContextLike_kcContextExclusionsFtlCode & {
|
||||
extraThemeProperties: string[] | undefined;
|
||||
projectDirPath: string;
|
||||
projectBuildDirPath: string;
|
||||
environmentVariables: { name: string; default: string }[];
|
||||
implementedThemeTypes: BuildContext["implementedThemeTypes"];
|
||||
themeSrcDirPath: string;
|
||||
bundler: "vite" | "webpack";
|
||||
packageJsonFilePath: string;
|
||||
};
|
||||
|
||||
assert<BuildContext extends BuildContextLike ? true : false>();
|
||||
|
||||
export async function generateResourcesForMainTheme(params: {
|
||||
themeName: string;
|
||||
resourcesDirPath: string;
|
||||
buildContext: BuildContextLike;
|
||||
}): Promise<void> {
|
||||
const { themeName, resourcesDirPath, buildContext } = params;
|
||||
|
||||
const getThemeTypeDirPath = (params: { themeType: ThemeType | "email" }) => {
|
||||
const { themeType } = params;
|
||||
return pathJoin(resourcesDirPath, "theme", themeName, themeType);
|
||||
};
|
||||
|
||||
for (const themeType of ["login", "account"] as const) {
|
||||
if (!buildContext.implementedThemeTypes[themeType].isImplemented) {
|
||||
continue;
|
||||
}
|
||||
|
||||
const isForAccountSpa =
|
||||
themeType === "account" &&
|
||||
(assert(buildContext.implementedThemeTypes.account.isImplemented),
|
||||
buildContext.implementedThemeTypes.account.type === "Single-Page");
|
||||
|
||||
const themeTypeDirPath = getThemeTypeDirPath({ themeType });
|
||||
|
||||
apply_replacers_and_move_to_theme_resources: {
|
||||
const destDirPath = pathJoin(
|
||||
themeTypeDirPath,
|
||||
"resources",
|
||||
WELL_KNOWN_DIRECTORY_BASE_NAME.DIST
|
||||
);
|
||||
|
||||
// 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" &&
|
||||
buildContext.implementedThemeTypes.login.isImplemented
|
||||
) {
|
||||
// NOTE: We prevent doing it twice, it has been done for the login theme.
|
||||
|
||||
transformCodebase({
|
||||
srcDirPath: pathJoin(
|
||||
getThemeTypeDirPath({
|
||||
themeType: "login"
|
||||
}),
|
||||
"resources",
|
||||
WELL_KNOWN_DIRECTORY_BASE_NAME.DIST
|
||||
),
|
||||
destDirPath
|
||||
});
|
||||
|
||||
break apply_replacers_and_move_to_theme_resources;
|
||||
}
|
||||
|
||||
{
|
||||
const dirPath = pathJoin(
|
||||
buildContext.projectBuildDirPath,
|
||||
WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES
|
||||
);
|
||||
|
||||
if (fs.existsSync(dirPath)) {
|
||||
assert(buildContext.bundler === "webpack");
|
||||
|
||||
throw new Error(
|
||||
[
|
||||
`Keycloakify build error: The ${WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES} directory shouldn't exist in your build directory.`,
|
||||
`(${pathRelative(process.cwd(), dirPath)}).\n`,
|
||||
`Theses assets are only required for local development with Storybook.",
|
||||
"Please remove this directory as an additional step of your command.\n`,
|
||||
`For example: \`"build": "... && rimraf ${pathRelative(buildContext.projectDirPath, dirPath)}"\``
|
||||
].join(" ")
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
transformCodebase({
|
||||
srcDirPath: buildContext.projectBuildDirPath,
|
||||
destDirPath,
|
||||
transformSourceCode: ({ filePath, fileRelativePath, sourceCode }) => {
|
||||
if (filePath.endsWith(".css")) {
|
||||
const { fixedCssCode } = replaceImportsInCssCode({
|
||||
cssCode: sourceCode.toString("utf8"),
|
||||
cssFileRelativeDirPath: pathDirname(fileRelativePath),
|
||||
buildContext
|
||||
});
|
||||
|
||||
return {
|
||||
modifiedSourceCode: Buffer.from(fixedCssCode, "utf8")
|
||||
};
|
||||
}
|
||||
|
||||
if (filePath.endsWith(".js")) {
|
||||
const { fixedJsCode } = replaceImportsInJsCode({
|
||||
jsCode: sourceCode.toString("utf8"),
|
||||
buildContext
|
||||
});
|
||||
|
||||
return {
|
||||
modifiedSourceCode: Buffer.from(fixedJsCode, "utf8")
|
||||
};
|
||||
}
|
||||
|
||||
return { modifiedSourceCode: sourceCode };
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
const { generateFtlFilesCode } = generateFtlFilesCodeFactory({
|
||||
themeName,
|
||||
indexHtmlCode: fs
|
||||
.readFileSync(pathJoin(buildContext.projectBuildDirPath, "index.html"))
|
||||
.toString("utf8"),
|
||||
buildContext,
|
||||
keycloakifyVersion: readThisNpmPackageVersion(),
|
||||
themeType,
|
||||
fieldNames: readFieldNameUsage({
|
||||
themeSrcDirPath: buildContext.themeSrcDirPath,
|
||||
themeType
|
||||
})
|
||||
});
|
||||
|
||||
[
|
||||
...(() => {
|
||||
switch (themeType) {
|
||||
case "login":
|
||||
return LOGIN_THEME_PAGE_IDS;
|
||||
case "account":
|
||||
return isForAccountSpa ? ["index.ftl"] : ACCOUNT_THEME_PAGE_IDS;
|
||||
}
|
||||
})(),
|
||||
...(isForAccountSpa
|
||||
? []
|
||||
: readExtraPagesNames({
|
||||
themeType,
|
||||
themeSrcDirPath: buildContext.themeSrcDirPath
|
||||
}))
|
||||
].forEach(pageId => {
|
||||
const { ftlCode } = generateFtlFilesCode({ pageId });
|
||||
|
||||
fs.writeFileSync(
|
||||
pathJoin(themeTypeDirPath, pageId),
|
||||
Buffer.from(ftlCode, "utf8")
|
||||
);
|
||||
});
|
||||
|
||||
i18n_messages_generation: {
|
||||
if (isForAccountSpa) {
|
||||
break i18n_messages_generation;
|
||||
}
|
||||
|
||||
generateMessageProperties({
|
||||
themeSrcDirPath: buildContext.themeSrcDirPath,
|
||||
themeType
|
||||
}).forEach(({ languageTag, propertiesFileSource }) => {
|
||||
const messagesDirPath = pathJoin(themeTypeDirPath, "messages");
|
||||
|
||||
fs.mkdirSync(pathJoin(themeTypeDirPath, "messages"), {
|
||||
recursive: true
|
||||
});
|
||||
|
||||
const propertiesFilePath = pathJoin(
|
||||
messagesDirPath,
|
||||
`messages_${languageTag}.properties`
|
||||
);
|
||||
|
||||
fs.writeFileSync(
|
||||
propertiesFilePath,
|
||||
Buffer.from(propertiesFileSource, "utf8")
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
bring_in_account_v3_i18n_messages: {
|
||||
if (!buildContext.implementedThemeTypes.account.isImplemented) {
|
||||
break bring_in_account_v3_i18n_messages;
|
||||
}
|
||||
if (buildContext.implementedThemeTypes.account.type !== "Single-Page") {
|
||||
break bring_in_account_v3_i18n_messages;
|
||||
}
|
||||
|
||||
const accountUiDirPath = child_process
|
||||
.execSync("npm list @keycloakify/keycloak-account-ui --parseable", {
|
||||
cwd: pathDirname(buildContext.packageJsonFilePath)
|
||||
})
|
||||
.toString("utf8")
|
||||
.trim();
|
||||
|
||||
const messagesDirPath = pathJoin(accountUiDirPath, "messages");
|
||||
|
||||
if (!fs.existsSync(messagesDirPath)) {
|
||||
throw new Error(
|
||||
`Please update @keycloakify/keycloak-account-ui to 25.0.4-rc.5 or later.`
|
||||
);
|
||||
}
|
||||
|
||||
transformCodebase({
|
||||
srcDirPath: messagesDirPath,
|
||||
destDirPath: pathJoin(
|
||||
getThemeTypeDirPath({ themeType: "account" }),
|
||||
"messages"
|
||||
)
|
||||
});
|
||||
}
|
||||
|
||||
keycloak_static_resources: {
|
||||
if (isForAccountSpa) {
|
||||
break keycloak_static_resources;
|
||||
}
|
||||
|
||||
transformCodebase({
|
||||
srcDirPath: pathJoin(
|
||||
getThisCodebaseRootDirPath(),
|
||||
"res",
|
||||
"public",
|
||||
WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES,
|
||||
themeType
|
||||
),
|
||||
destDirPath: pathJoin(themeTypeDirPath, "resources")
|
||||
});
|
||||
}
|
||||
|
||||
fs.writeFileSync(
|
||||
pathJoin(themeTypeDirPath, "theme.properties"),
|
||||
Buffer.from(
|
||||
[
|
||||
`parent=${(() => {
|
||||
switch (themeType) {
|
||||
case "account":
|
||||
return isForAccountSpa ? "base" : "account-v1";
|
||||
case "login":
|
||||
return "keycloak";
|
||||
}
|
||||
assert<Equals<typeof themeType, never>>(false);
|
||||
})()}`,
|
||||
...(isForAccountSpa ? ["deprecatedMode=false"] : []),
|
||||
...(buildContext.extraThemeProperties ?? []),
|
||||
...buildContext.environmentVariables.map(
|
||||
({ name, default: defaultValue }) =>
|
||||
`${name}=\${env.${name}:${escapeStringForPropertiesFile(defaultValue)}}`
|
||||
)
|
||||
].join("\n\n"),
|
||||
"utf8"
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
email: {
|
||||
if (!buildContext.implementedThemeTypes.email.isImplemented) {
|
||||
break email;
|
||||
}
|
||||
|
||||
const emailThemeSrcDirPath = pathJoin(buildContext.themeSrcDirPath, "email");
|
||||
|
||||
transformCodebase({
|
||||
srcDirPath: emailThemeSrcDirPath,
|
||||
destDirPath: getThemeTypeDirPath({ themeType: "email" })
|
||||
});
|
||||
}
|
||||
|
||||
bring_in_account_v1: {
|
||||
if (!buildContext.implementedThemeTypes.account.isImplemented) {
|
||||
break bring_in_account_v1;
|
||||
}
|
||||
|
||||
if (buildContext.implementedThemeTypes.account.type !== "Multi-Page") {
|
||||
break bring_in_account_v1;
|
||||
}
|
||||
|
||||
transformCodebase({
|
||||
srcDirPath: pathJoin(getThisCodebaseRootDirPath(), "res", "account-v1"),
|
||||
destDirPath: pathJoin(resourcesDirPath, "theme", "account-v1", "account")
|
||||
});
|
||||
}
|
||||
|
||||
{
|
||||
const metaInfKeycloakThemes: MetaInfKeycloakTheme = { themes: [] };
|
||||
|
||||
metaInfKeycloakThemes.themes.push({
|
||||
name: themeName,
|
||||
types: objectEntries(buildContext.implementedThemeTypes)
|
||||
.filter(([, { isImplemented }]) => isImplemented)
|
||||
.map(([themeType]) => themeType)
|
||||
});
|
||||
|
||||
if (buildContext.implementedThemeTypes.account.isImplemented) {
|
||||
metaInfKeycloakThemes.themes.push({
|
||||
name: "account-v1",
|
||||
types: ["account"]
|
||||
});
|
||||
}
|
||||
|
||||
writeMetaInfKeycloakThemes({
|
||||
resourcesDirPath,
|
||||
getNewMetaInfKeycloakTheme: () => metaInfKeycloakThemes
|
||||
});
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,70 @@
|
||||
import { join as pathJoin, extname as pathExtname, sep as pathSep } from "path";
|
||||
import { transformCodebase } from "../../tools/transformCodebase";
|
||||
import type { BuildContext } from "../../shared/buildContext";
|
||||
import { writeMetaInfKeycloakThemes } from "../../shared/metaInfKeycloakThemes";
|
||||
import { assert } from "tsafe/assert";
|
||||
|
||||
export type BuildContextLike = {
|
||||
keycloakifyBuildDirPath: string;
|
||||
};
|
||||
|
||||
assert<BuildContext extends BuildContextLike ? true : false>();
|
||||
|
||||
export function generateResourcesForThemeVariant(params: {
|
||||
resourcesDirPath: string;
|
||||
themeName: string;
|
||||
themeVariantName: string;
|
||||
}) {
|
||||
const { resourcesDirPath, themeName, themeVariantName } = params;
|
||||
|
||||
const mainThemeDirPath = pathJoin(resourcesDirPath, "theme", themeName);
|
||||
|
||||
transformCodebase({
|
||||
srcDirPath: mainThemeDirPath,
|
||||
destDirPath: pathJoin(mainThemeDirPath, "..", themeVariantName),
|
||||
transformSourceCode: ({ fileRelativePath, sourceCode }) => {
|
||||
if (
|
||||
pathExtname(fileRelativePath) === ".ftl" &&
|
||||
fileRelativePath.split(pathSep).length === 2
|
||||
) {
|
||||
const modifiedSourceCode = Buffer.from(
|
||||
Buffer.from(sourceCode)
|
||||
.toString("utf-8")
|
||||
.replace(
|
||||
`"themeName": "${themeName}"`,
|
||||
`"themeName": "${themeVariantName}"`
|
||||
),
|
||||
"utf8"
|
||||
);
|
||||
|
||||
assert(Buffer.compare(modifiedSourceCode, sourceCode) !== 0);
|
||||
|
||||
return { modifiedSourceCode };
|
||||
}
|
||||
|
||||
return { modifiedSourceCode: sourceCode };
|
||||
}
|
||||
});
|
||||
|
||||
writeMetaInfKeycloakThemes({
|
||||
resourcesDirPath,
|
||||
getNewMetaInfKeycloakTheme: ({ metaInfKeycloakTheme }) => {
|
||||
assert(metaInfKeycloakTheme !== undefined);
|
||||
|
||||
const newMetaInfKeycloakTheme = metaInfKeycloakTheme;
|
||||
|
||||
newMetaInfKeycloakTheme.themes.push({
|
||||
name: themeVariantName,
|
||||
types: (() => {
|
||||
const theme = newMetaInfKeycloakTheme.themes.find(
|
||||
({ name }) => name === themeName
|
||||
);
|
||||
assert(theme !== undefined);
|
||||
return theme.types;
|
||||
})()
|
||||
});
|
||||
|
||||
return newMetaInfKeycloakTheme;
|
||||
}
|
||||
});
|
||||
}
|
||||
@ -7,7 +7,7 @@ import { getThisCodebaseRootDirPath } from "../../tools/getThisCodebaseRootDirPa
|
||||
/** Assumes the theme type exists */
|
||||
export function readFieldNameUsage(params: {
|
||||
themeSrcDirPath: string;
|
||||
themeType: Exclude<ThemeType, "admin">;
|
||||
themeType: ThemeType;
|
||||
}): string[] {
|
||||
const { themeSrcDirPath, themeType } = params;
|
||||
|
||||
|
||||
@ -2,16 +2,19 @@ import { generateResources } from "./generateResources";
|
||||
import { join as pathJoin, relative as pathRelative, sep as pathSep } from "path";
|
||||
import * as child_process from "child_process";
|
||||
import * as fs from "fs";
|
||||
import type { BuildContext } from "../shared/buildContext";
|
||||
import { getBuildContext } from "../shared/buildContext";
|
||||
import { VITE_PLUGIN_SUB_SCRIPTS_ENV_NAMES } from "../shared/constants";
|
||||
import { buildJars } from "./buildJars";
|
||||
import type { CliCommandOptions } from "../main";
|
||||
import chalk from "chalk";
|
||||
import { readThisNpmPackageVersion } from "../tools/readThisNpmPackageVersion";
|
||||
import * as os from "os";
|
||||
import { rmSync } from "../tools/fs.rmSync";
|
||||
|
||||
export async function command(params: { buildContext: BuildContext }) {
|
||||
const { buildContext } = params;
|
||||
export async function command(params: { cliCommandOptions: CliCommandOptions }) {
|
||||
const { cliCommandOptions } = params;
|
||||
|
||||
const buildContext = getBuildContext({ cliCommandOptions });
|
||||
|
||||
exit_if_maven_not_installed: {
|
||||
let commandOutput: Buffer | undefined = undefined;
|
||||
|
||||
@ -4,9 +4,8 @@ import { termost } from "termost";
|
||||
import { readThisNpmPackageVersion } from "./tools/readThisNpmPackageVersion";
|
||||
import * as child_process from "child_process";
|
||||
import { assertNoPnpmDlx } from "./tools/assertNoPnpmDlx";
|
||||
import { getBuildContext } from "./shared/buildContext";
|
||||
|
||||
type CliCommandOptions = {
|
||||
export type CliCommandOptions = {
|
||||
projectDirPath: string | undefined;
|
||||
};
|
||||
|
||||
@ -70,10 +69,10 @@ program
|
||||
})
|
||||
.task({
|
||||
skip,
|
||||
handler: async ({ projectDirPath }) => {
|
||||
handler: async cliCommandOptions => {
|
||||
const { command } = await import("./keycloakify");
|
||||
|
||||
await command({ buildContext: getBuildContext({ projectDirPath }) });
|
||||
await command({ cliCommandOptions });
|
||||
}
|
||||
});
|
||||
|
||||
@ -131,13 +130,10 @@ program
|
||||
})
|
||||
.task({
|
||||
skip,
|
||||
handler: async ({ projectDirPath, keycloakVersion, port, realmJsonFilePath }) => {
|
||||
handler: async cliCommandOptions => {
|
||||
const { command } = await import("./start-keycloak");
|
||||
|
||||
await command({
|
||||
buildContext: getBuildContext({ projectDirPath }),
|
||||
cliCommandOptions: { keycloakVersion, port, realmJsonFilePath }
|
||||
});
|
||||
await command({ cliCommandOptions });
|
||||
}
|
||||
});
|
||||
|
||||
@ -148,10 +144,10 @@ program
|
||||
})
|
||||
.task({
|
||||
skip,
|
||||
handler: async ({ projectDirPath }) => {
|
||||
handler: async cliCommandOptions => {
|
||||
const { command } = await import("./eject-page");
|
||||
|
||||
await command({ buildContext: getBuildContext({ projectDirPath }) });
|
||||
await command({ cliCommandOptions });
|
||||
}
|
||||
});
|
||||
|
||||
@ -162,10 +158,10 @@ program
|
||||
})
|
||||
.task({
|
||||
skip,
|
||||
handler: async ({ projectDirPath }) => {
|
||||
handler: async cliCommandOptions => {
|
||||
const { command } = await import("./add-story");
|
||||
|
||||
await command({ buildContext: getBuildContext({ projectDirPath }) });
|
||||
await command({ cliCommandOptions });
|
||||
}
|
||||
});
|
||||
|
||||
@ -176,10 +172,10 @@ program
|
||||
})
|
||||
.task({
|
||||
skip,
|
||||
handler: async ({ projectDirPath }) => {
|
||||
handler: async cliCommandOptions => {
|
||||
const { command } = await import("./initialize-email-theme");
|
||||
|
||||
await command({ buildContext: getBuildContext({ projectDirPath }) });
|
||||
await command({ cliCommandOptions });
|
||||
}
|
||||
});
|
||||
|
||||
@ -190,10 +186,10 @@ program
|
||||
})
|
||||
.task({
|
||||
skip,
|
||||
handler: async ({ projectDirPath }) => {
|
||||
handler: async cliCommandOptions => {
|
||||
const { command } = await import("./initialize-account-theme");
|
||||
|
||||
await command({ buildContext: getBuildContext({ projectDirPath }) });
|
||||
await command({ cliCommandOptions });
|
||||
}
|
||||
});
|
||||
|
||||
@ -205,10 +201,10 @@ program
|
||||
})
|
||||
.task({
|
||||
skip,
|
||||
handler: async ({ projectDirPath }) => {
|
||||
handler: async cliCommandOptions => {
|
||||
const { command } = await import("./copy-keycloak-resources-to-public");
|
||||
|
||||
await command({ buildContext: getBuildContext({ projectDirPath }) });
|
||||
await command({ cliCommandOptions });
|
||||
}
|
||||
});
|
||||
|
||||
@ -220,60 +216,10 @@ program
|
||||
})
|
||||
.task({
|
||||
skip,
|
||||
handler: async ({ projectDirPath }) => {
|
||||
handler: async cliCommandOptions => {
|
||||
const { command } = await import("./update-kc-gen");
|
||||
|
||||
await command({ buildContext: getBuildContext({ projectDirPath }) });
|
||||
}
|
||||
});
|
||||
|
||||
program
|
||||
.command({
|
||||
name: "postinstall",
|
||||
description: "Initialize all the Keycloakify UI modules installed in the project."
|
||||
})
|
||||
.task({
|
||||
skip,
|
||||
handler: async ({ projectDirPath }) => {
|
||||
const { command } = await import("./postinstall");
|
||||
|
||||
await command({ buildContext: getBuildContext({ projectDirPath }) });
|
||||
}
|
||||
});
|
||||
|
||||
program
|
||||
.command<{
|
||||
file: string;
|
||||
}>({
|
||||
name: "eject-file",
|
||||
description: [
|
||||
"WARNING: Not usable yet, will be used for future features",
|
||||
"Take ownership over a given file"
|
||||
].join(" ")
|
||||
})
|
||||
.option({
|
||||
key: "file",
|
||||
name: (() => {
|
||||
const name = "file";
|
||||
|
||||
optionsKeys.push(name);
|
||||
|
||||
return name;
|
||||
})(),
|
||||
description: [
|
||||
"Relative path of the file relative to the directory of your keycloak theme source",
|
||||
"Example `--file src/login/page/Login.tsx`"
|
||||
].join(" ")
|
||||
})
|
||||
.task({
|
||||
skip,
|
||||
handler: async ({ projectDirPath, file }) => {
|
||||
const { command } = await import("./eject-file");
|
||||
|
||||
await command({
|
||||
buildContext: getBuildContext({ projectDirPath }),
|
||||
cliCommandOptions: { file }
|
||||
});
|
||||
await command({ cliCommandOptions });
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
@ -1,82 +0,0 @@
|
||||
import { getIsPrettierAvailable, runPrettier } from "../tools/runPrettier";
|
||||
import * as fsPr from "fs/promises";
|
||||
import { join as pathJoin, sep as pathSep } from "path";
|
||||
import { assert } from "tsafe/assert";
|
||||
import type { BuildContext } from "../shared/buildContext";
|
||||
import { KEYCLOAK_THEME } from "../shared/constants";
|
||||
|
||||
export type BuildContextLike = {
|
||||
themeSrcDirPath: string;
|
||||
};
|
||||
|
||||
assert<BuildContext extends BuildContextLike ? true : false>();
|
||||
|
||||
export async function getUiModuleFileSourceCodeReadyToBeCopied(params: {
|
||||
buildContext: BuildContextLike;
|
||||
fileRelativePath: string;
|
||||
isForEjection: boolean;
|
||||
uiModuleDirPath: string;
|
||||
uiModuleName: string;
|
||||
uiModuleVersion: string;
|
||||
}): Promise<Buffer> {
|
||||
const {
|
||||
buildContext,
|
||||
uiModuleDirPath,
|
||||
fileRelativePath,
|
||||
isForEjection,
|
||||
uiModuleName,
|
||||
uiModuleVersion
|
||||
} = params;
|
||||
|
||||
let sourceCode = (
|
||||
await fsPr.readFile(pathJoin(uiModuleDirPath, KEYCLOAK_THEME, fileRelativePath))
|
||||
).toString("utf8");
|
||||
|
||||
const toComment = (lines: string[]) => {
|
||||
for (const ext of [".ts", ".tsx", ".css", ".less", ".sass", ".js", ".jsx"]) {
|
||||
if (!fileRelativePath.endsWith(ext)) {
|
||||
continue;
|
||||
}
|
||||
|
||||
return [`/**`, ...lines.map(line => ` * ${line}`), ` */`].join("\n");
|
||||
}
|
||||
|
||||
if (fileRelativePath.endsWith(".html")) {
|
||||
return [`<!--`, ...lines.map(line => ` ${line}`), `-->`].join("\n");
|
||||
}
|
||||
|
||||
return undefined;
|
||||
};
|
||||
|
||||
const comment = toComment(
|
||||
isForEjection
|
||||
? [`This file was ejected from ${uiModuleName} version ${uiModuleVersion}.`]
|
||||
: [
|
||||
`WARNING: Before modifying this file run the following command:`,
|
||||
``,
|
||||
`$ npx keycloakify eject-file --file ${fileRelativePath.split(pathSep).join("/")}`,
|
||||
``,
|
||||
`This file comes from ${uiModuleName} version ${uiModuleVersion}.`,
|
||||
`This file has been copied over to your repo by your postinstall script: \`npx keycloakify postinstall\``
|
||||
]
|
||||
);
|
||||
|
||||
if (comment !== undefined) {
|
||||
sourceCode = [comment, ``, sourceCode].join("\n");
|
||||
}
|
||||
|
||||
const destFilePath = pathJoin(buildContext.themeSrcDirPath, fileRelativePath);
|
||||
|
||||
format: {
|
||||
if (!(await getIsPrettierAvailable())) {
|
||||
break format;
|
||||
}
|
||||
|
||||
sourceCode = await runPrettier({
|
||||
filePath: destFilePath,
|
||||
sourceCode
|
||||
});
|
||||
}
|
||||
|
||||
return Buffer.from(sourceCode, "utf8");
|
||||
}
|
||||
@ -1 +0,0 @@
|
||||
export * from "./postinstall";
|
||||
@ -1,157 +0,0 @@
|
||||
import { assert, type Equals, is } from "tsafe/assert";
|
||||
import type { BuildContext } from "../shared/buildContext";
|
||||
import type { UiModuleMeta } from "./uiModuleMeta";
|
||||
import { z } from "zod";
|
||||
import { id } from "tsafe/id";
|
||||
import * as fsPr from "fs/promises";
|
||||
import { SemVer } from "../tools/SemVer";
|
||||
import { same } from "evt/tools/inDepth/same";
|
||||
import { runPrettier, getIsPrettierAvailable } from "../tools/runPrettier";
|
||||
import { npmInstall } from "../tools/npmInstall";
|
||||
import { dirname as pathDirname } from "path";
|
||||
|
||||
export type BuildContextLike = {
|
||||
packageJsonFilePath: string;
|
||||
};
|
||||
|
||||
assert<BuildContext extends BuildContextLike ? true : false>();
|
||||
|
||||
export type UiModuleMetaLike = {
|
||||
moduleName: string;
|
||||
peerDependencies: Record<string, string>;
|
||||
};
|
||||
|
||||
assert<UiModuleMeta extends UiModuleMetaLike ? true : false>();
|
||||
|
||||
export async function installUiModulesPeerDependencies(params: {
|
||||
buildContext: BuildContextLike;
|
||||
uiModuleMetas: UiModuleMetaLike[];
|
||||
}): Promise<void | never> {
|
||||
const { buildContext, uiModuleMetas } = params;
|
||||
|
||||
const { uiModulesPerDependencies } = (() => {
|
||||
const uiModulesPerDependencies: Record<string, string> = {};
|
||||
|
||||
for (const { peerDependencies } of uiModuleMetas) {
|
||||
for (const [peerDependencyName, versionRange_candidate] of Object.entries(
|
||||
peerDependencies
|
||||
)) {
|
||||
const versionRange = (() => {
|
||||
const versionRange_current =
|
||||
uiModulesPerDependencies[peerDependencyName];
|
||||
|
||||
if (versionRange_current === undefined) {
|
||||
return versionRange_candidate;
|
||||
}
|
||||
|
||||
if (versionRange_current === "*") {
|
||||
return versionRange_candidate;
|
||||
}
|
||||
|
||||
if (versionRange_candidate === "*") {
|
||||
return versionRange_current;
|
||||
}
|
||||
|
||||
const { versionRange } = [
|
||||
versionRange_current,
|
||||
versionRange_candidate
|
||||
]
|
||||
.map(versionRange => ({
|
||||
versionRange,
|
||||
semVer: SemVer.parse(
|
||||
(() => {
|
||||
if (
|
||||
versionRange.startsWith("^") ||
|
||||
versionRange.startsWith("~")
|
||||
) {
|
||||
return versionRange.slice(1);
|
||||
}
|
||||
|
||||
return versionRange;
|
||||
})()
|
||||
)
|
||||
}))
|
||||
.sort((a, b) => SemVer.compare(b.semVer, a.semVer))[0];
|
||||
|
||||
return versionRange;
|
||||
})();
|
||||
|
||||
uiModulesPerDependencies[peerDependencyName] = versionRange;
|
||||
}
|
||||
}
|
||||
|
||||
return { uiModulesPerDependencies };
|
||||
})();
|
||||
|
||||
const parsedPackageJson = await (async () => {
|
||||
type ParsedPackageJson = {
|
||||
dependencies?: Record<string, string>;
|
||||
devDependencies?: Record<string, string>;
|
||||
};
|
||||
|
||||
const zParsedPackageJson = (() => {
|
||||
type TargetType = ParsedPackageJson;
|
||||
|
||||
const zParsedPackageJson = z.object({
|
||||
dependencies: z.record(z.string()).optional(),
|
||||
devDependencies: z.record(z.string()).optional()
|
||||
});
|
||||
|
||||
type InferredType = z.infer<typeof zParsedPackageJson>;
|
||||
|
||||
assert<Equals<InferredType, TargetType>>();
|
||||
|
||||
return id<z.ZodType<TargetType>>(zParsedPackageJson);
|
||||
})();
|
||||
|
||||
const parsedPackageJson = JSON.parse(
|
||||
(await fsPr.readFile(buildContext.packageJsonFilePath)).toString("utf8")
|
||||
);
|
||||
|
||||
zParsedPackageJson.parse(parsedPackageJson);
|
||||
|
||||
assert(is<ParsedPackageJson>(parsedPackageJson));
|
||||
|
||||
return parsedPackageJson;
|
||||
})();
|
||||
|
||||
const parsedPackageJson_before = JSON.parse(JSON.stringify(parsedPackageJson));
|
||||
|
||||
for (const [moduleName, versionRange] of Object.entries(uiModulesPerDependencies)) {
|
||||
if (moduleName.startsWith("@types/")) {
|
||||
(parsedPackageJson.devDependencies ??= {})[moduleName] = versionRange;
|
||||
continue;
|
||||
}
|
||||
|
||||
if (parsedPackageJson.devDependencies !== undefined) {
|
||||
delete parsedPackageJson.devDependencies[moduleName];
|
||||
}
|
||||
|
||||
(parsedPackageJson.dependencies ??= {})[moduleName] = versionRange;
|
||||
}
|
||||
|
||||
if (same(parsedPackageJson, parsedPackageJson_before)) {
|
||||
return;
|
||||
}
|
||||
|
||||
let packageJsonContentStr = JSON.stringify(parsedPackageJson, null, 2);
|
||||
|
||||
format: {
|
||||
if (!(await getIsPrettierAvailable())) {
|
||||
break format;
|
||||
}
|
||||
|
||||
packageJsonContentStr = await runPrettier({
|
||||
sourceCode: packageJsonContentStr,
|
||||
filePath: buildContext.packageJsonFilePath
|
||||
});
|
||||
}
|
||||
|
||||
await fsPr.writeFile(buildContext.packageJsonFilePath, packageJsonContentStr);
|
||||
|
||||
npmInstall({
|
||||
packageJsonDirPath: pathDirname(buildContext.packageJsonFilePath)
|
||||
});
|
||||
|
||||
process.exit(0);
|
||||
}
|
||||
@ -1,136 +0,0 @@
|
||||
import * as fsPr from "fs/promises";
|
||||
import {
|
||||
join as pathJoin,
|
||||
sep as pathSep,
|
||||
dirname as pathDirname,
|
||||
relative as pathRelative
|
||||
} from "path";
|
||||
import { assert } from "tsafe/assert";
|
||||
import type { BuildContext } from "../shared/buildContext";
|
||||
import type { UiModuleMeta } from "./uiModuleMeta";
|
||||
import { existsAsync } from "../tools/fs.existsAsync";
|
||||
import { getAbsoluteAndInOsFormatPath } from "../tools/getAbsoluteAndInOsFormatPath";
|
||||
|
||||
export type BuildContextLike = {
|
||||
themeSrcDirPath: string;
|
||||
};
|
||||
|
||||
assert<BuildContext extends BuildContextLike ? true : false>();
|
||||
|
||||
const DELIMITER_START = `# === Ejected files start ===`;
|
||||
const DELIMITER_END = `# === Ejected files end =====`;
|
||||
|
||||
export async function writeManagedGitignoreFile(params: {
|
||||
buildContext: BuildContextLike;
|
||||
uiModuleMetas: UiModuleMeta[];
|
||||
ejectedFilesRelativePaths: string[];
|
||||
}): Promise<void> {
|
||||
const { buildContext, uiModuleMetas, ejectedFilesRelativePaths } = params;
|
||||
|
||||
if (uiModuleMetas.length === 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
const filePath = pathJoin(buildContext.themeSrcDirPath, ".gitignore");
|
||||
|
||||
const content_new = Buffer.from(
|
||||
[
|
||||
`# This file is managed by Keycloakify, do not edit it manually.`,
|
||||
``,
|
||||
DELIMITER_START,
|
||||
...ejectedFilesRelativePaths
|
||||
.map(fileRelativePath => fileRelativePath.split(pathSep).join("/"))
|
||||
.map(line => `# ${line}`),
|
||||
DELIMITER_END,
|
||||
``,
|
||||
...uiModuleMetas
|
||||
.map(uiModuleMeta => [
|
||||
`# === ${uiModuleMeta.moduleName} v${uiModuleMeta.version} ===`,
|
||||
...uiModuleMeta.files
|
||||
.map(({ fileRelativePath }) => fileRelativePath)
|
||||
.filter(
|
||||
fileRelativePath =>
|
||||
!ejectedFilesRelativePaths.includes(fileRelativePath)
|
||||
)
|
||||
.map(
|
||||
fileRelativePath =>
|
||||
`/${fileRelativePath.split(pathSep).join("/").replace(/^\.\//, "")}`
|
||||
),
|
||||
|
||||
``
|
||||
])
|
||||
.flat()
|
||||
].join("\n"),
|
||||
"utf8"
|
||||
);
|
||||
|
||||
const content_current = await (async () => {
|
||||
if (!(await existsAsync(filePath))) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
return await fsPr.readFile(filePath);
|
||||
})();
|
||||
|
||||
if (content_current !== undefined && content_current.equals(content_new)) {
|
||||
return;
|
||||
}
|
||||
|
||||
create_dir: {
|
||||
const dirPath = pathDirname(filePath);
|
||||
|
||||
if (await existsAsync(dirPath)) {
|
||||
break create_dir;
|
||||
}
|
||||
|
||||
await fsPr.mkdir(dirPath, { recursive: true });
|
||||
}
|
||||
|
||||
await fsPr.writeFile(filePath, content_new);
|
||||
}
|
||||
|
||||
export async function readManagedGitignoreFile(params: {
|
||||
buildContext: BuildContextLike;
|
||||
}): Promise<{
|
||||
ejectedFilesRelativePaths: string[];
|
||||
}> {
|
||||
const { buildContext } = params;
|
||||
|
||||
const filePath = pathJoin(buildContext.themeSrcDirPath, ".gitignore");
|
||||
|
||||
if (!(await existsAsync(filePath))) {
|
||||
return { ejectedFilesRelativePaths: [] };
|
||||
}
|
||||
|
||||
const contentStr = (await fsPr.readFile(filePath)).toString("utf8");
|
||||
|
||||
const payload = (() => {
|
||||
const index_start = contentStr.indexOf(DELIMITER_START);
|
||||
const index_end = contentStr.indexOf(DELIMITER_END);
|
||||
|
||||
if (index_start === -1 || index_end === -1) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
return contentStr.slice(index_start + DELIMITER_START.length, index_end).trim();
|
||||
})();
|
||||
|
||||
if (payload === undefined) {
|
||||
return { ejectedFilesRelativePaths: [] };
|
||||
}
|
||||
|
||||
const ejectedFilesRelativePaths = payload
|
||||
.split("\n")
|
||||
.map(line => line.trim())
|
||||
.map(line => line.replace(/^# /, ""))
|
||||
.filter(line => line !== "")
|
||||
.map(line =>
|
||||
getAbsoluteAndInOsFormatPath({
|
||||
cwd: buildContext.themeSrcDirPath,
|
||||
pathIsh: line
|
||||
})
|
||||
)
|
||||
.map(filePath => pathRelative(buildContext.themeSrcDirPath, filePath));
|
||||
|
||||
return { ejectedFilesRelativePaths };
|
||||
}
|
||||
@ -1,101 +0,0 @@
|
||||
import type { BuildContext } from "../shared/buildContext";
|
||||
import { getUiModuleMetas, computeHash } from "./uiModuleMeta";
|
||||
import { installUiModulesPeerDependencies } from "./installUiModulesPeerDependencies";
|
||||
import {
|
||||
readManagedGitignoreFile,
|
||||
writeManagedGitignoreFile
|
||||
} from "./managedGitignoreFile";
|
||||
import { dirname as pathDirname } from "path";
|
||||
import { join as pathJoin } from "path";
|
||||
import { existsAsync } from "../tools/fs.existsAsync";
|
||||
import * as fsPr from "fs/promises";
|
||||
import { getIsTrackedByGit } from "../tools/isTrackedByGit";
|
||||
import { untrackFromGit } from "../tools/untrackFromGit";
|
||||
|
||||
export async function command(params: { buildContext: BuildContext }) {
|
||||
const { buildContext } = params;
|
||||
|
||||
const uiModuleMetas = await getUiModuleMetas({ buildContext });
|
||||
|
||||
await installUiModulesPeerDependencies({
|
||||
buildContext,
|
||||
uiModuleMetas
|
||||
});
|
||||
|
||||
const { ejectedFilesRelativePaths } = await readManagedGitignoreFile({
|
||||
buildContext
|
||||
});
|
||||
|
||||
await writeManagedGitignoreFile({
|
||||
buildContext,
|
||||
ejectedFilesRelativePaths,
|
||||
uiModuleMetas
|
||||
});
|
||||
|
||||
await Promise.all(
|
||||
uiModuleMetas
|
||||
.map(uiModuleMeta =>
|
||||
Promise.all(
|
||||
uiModuleMeta.files.map(
|
||||
async ({ fileRelativePath, copyableFilePath, hash }) => {
|
||||
if (ejectedFilesRelativePaths.includes(fileRelativePath)) {
|
||||
return;
|
||||
}
|
||||
|
||||
const destFilePath = pathJoin(
|
||||
buildContext.themeSrcDirPath,
|
||||
fileRelativePath
|
||||
);
|
||||
|
||||
const doesFileExist = await existsAsync(destFilePath);
|
||||
|
||||
skip_condition: {
|
||||
if (!doesFileExist) {
|
||||
break skip_condition;
|
||||
}
|
||||
|
||||
const destFileHash = computeHash(
|
||||
await fsPr.readFile(destFilePath)
|
||||
);
|
||||
|
||||
if (destFileHash !== hash) {
|
||||
break skip_condition;
|
||||
}
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
git_untrack: {
|
||||
if (!doesFileExist) {
|
||||
break git_untrack;
|
||||
}
|
||||
|
||||
const isTracked = await getIsTrackedByGit({
|
||||
filePath: destFilePath
|
||||
});
|
||||
|
||||
if (!isTracked) {
|
||||
break git_untrack;
|
||||
}
|
||||
|
||||
await untrackFromGit({
|
||||
filePath: destFilePath
|
||||
});
|
||||
}
|
||||
|
||||
{
|
||||
const dirName = pathDirname(destFilePath);
|
||||
|
||||
if (!(await existsAsync(dirName))) {
|
||||
await fsPr.mkdir(dirName, { recursive: true });
|
||||
}
|
||||
}
|
||||
|
||||
await fsPr.copyFile(copyableFilePath, destFilePath);
|
||||
}
|
||||
)
|
||||
)
|
||||
)
|
||||
.flat()
|
||||
);
|
||||
}
|
||||
@ -1,308 +0,0 @@
|
||||
import { assert, type Equals, is } from "tsafe/assert";
|
||||
import { id } from "tsafe/id";
|
||||
import { z } from "zod";
|
||||
import { join as pathJoin, dirname as pathDirname } from "path";
|
||||
import * as fsPr from "fs/promises";
|
||||
import type { BuildContext } from "../shared/buildContext";
|
||||
import { existsAsync } from "../tools/fs.existsAsync";
|
||||
import { listInstalledModules } from "../tools/listInstalledModules";
|
||||
import { crawlAsync } from "../tools/crawlAsync";
|
||||
import { getIsPrettierAvailable, getPrettier } from "../tools/runPrettier";
|
||||
import { readThisNpmPackageVersion } from "../tools/readThisNpmPackageVersion";
|
||||
import {
|
||||
getUiModuleFileSourceCodeReadyToBeCopied,
|
||||
type BuildContextLike as BuildContextLike_getUiModuleFileSourceCodeReadyToBeCopied
|
||||
} from "./getUiModuleFileSourceCodeReadyToBeCopied";
|
||||
import * as crypto from "crypto";
|
||||
import { KEYCLOAK_THEME } from "../shared/constants";
|
||||
import { exclude } from "tsafe/exclude";
|
||||
|
||||
export type UiModuleMeta = {
|
||||
moduleName: string;
|
||||
version: string;
|
||||
files: {
|
||||
fileRelativePath: string;
|
||||
hash: string;
|
||||
copyableFilePath: string;
|
||||
}[];
|
||||
peerDependencies: Record<string, string>;
|
||||
};
|
||||
|
||||
const zUiModuleMeta = (() => {
|
||||
type ExpectedType = UiModuleMeta;
|
||||
|
||||
const zTargetType = z.object({
|
||||
moduleName: z.string(),
|
||||
version: z.string(),
|
||||
files: z.array(
|
||||
z.object({
|
||||
fileRelativePath: z.string(),
|
||||
hash: z.string(),
|
||||
copyableFilePath: z.string()
|
||||
})
|
||||
),
|
||||
peerDependencies: z.record(z.string())
|
||||
});
|
||||
|
||||
type InferredType = z.infer<typeof zTargetType>;
|
||||
|
||||
assert<Equals<InferredType, ExpectedType>>();
|
||||
|
||||
return id<z.ZodType<ExpectedType>>(zTargetType);
|
||||
})();
|
||||
|
||||
type ParsedCacheFile = {
|
||||
keycloakifyVersion: string;
|
||||
prettierConfigHash: string | null;
|
||||
thisFilePath: string;
|
||||
uiModuleMetas: UiModuleMeta[];
|
||||
};
|
||||
|
||||
const zParsedCacheFile = (() => {
|
||||
type ExpectedType = ParsedCacheFile;
|
||||
|
||||
const zTargetType = z.object({
|
||||
keycloakifyVersion: z.string(),
|
||||
prettierConfigHash: z.union([z.string(), z.null()]),
|
||||
thisFilePath: z.string(),
|
||||
uiModuleMetas: z.array(zUiModuleMeta)
|
||||
});
|
||||
|
||||
type InferredType = z.infer<typeof zTargetType>;
|
||||
|
||||
assert<Equals<InferredType, ExpectedType>>();
|
||||
|
||||
return id<z.ZodType<ExpectedType>>(zTargetType);
|
||||
})();
|
||||
|
||||
const CACHE_FILE_RELATIVE_PATH = pathJoin("ui-modules", "cache.json");
|
||||
|
||||
export type BuildContextLike =
|
||||
BuildContextLike_getUiModuleFileSourceCodeReadyToBeCopied & {
|
||||
cacheDirPath: string;
|
||||
packageJsonFilePath: string;
|
||||
projectDirPath: string;
|
||||
};
|
||||
|
||||
assert<BuildContext extends BuildContextLike ? true : false>();
|
||||
|
||||
export async function getUiModuleMetas(params: {
|
||||
buildContext: BuildContextLike;
|
||||
}): Promise<UiModuleMeta[]> {
|
||||
const { buildContext } = params;
|
||||
|
||||
const cacheFilePath = pathJoin(buildContext.cacheDirPath, CACHE_FILE_RELATIVE_PATH);
|
||||
|
||||
const keycloakifyVersion = readThisNpmPackageVersion();
|
||||
|
||||
const prettierConfigHash = await (async () => {
|
||||
if (!(await getIsPrettierAvailable())) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const { configHash } = await getPrettier();
|
||||
|
||||
return configHash;
|
||||
})();
|
||||
|
||||
const installedUiModules = await (async () => {
|
||||
const installedModulesWithKeycloakifyInTheName = await listInstalledModules({
|
||||
packageJsonFilePath: buildContext.packageJsonFilePath,
|
||||
projectDirPath: buildContext.packageJsonFilePath,
|
||||
filter: ({ moduleName }) =>
|
||||
moduleName.includes("keycloakify") && moduleName !== "keycloakify"
|
||||
});
|
||||
|
||||
return (
|
||||
await Promise.all(
|
||||
installedModulesWithKeycloakifyInTheName.map(async entry => {
|
||||
if (!(await existsAsync(pathJoin(entry.dirPath, KEYCLOAK_THEME)))) {
|
||||
return undefined;
|
||||
}
|
||||
return entry;
|
||||
})
|
||||
)
|
||||
).filter(exclude(undefined));
|
||||
})();
|
||||
|
||||
const cacheContent = await (async () => {
|
||||
if (!(await existsAsync(cacheFilePath))) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
return await fsPr.readFile(cacheFilePath);
|
||||
})();
|
||||
|
||||
const uiModuleMetas_cacheUpToDate: UiModuleMeta[] = await (async () => {
|
||||
const parsedCacheFile: ParsedCacheFile | undefined = await (async () => {
|
||||
if (cacheContent === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
const cacheContentStr = cacheContent.toString("utf8");
|
||||
|
||||
let parsedCacheFile: unknown;
|
||||
|
||||
try {
|
||||
parsedCacheFile = JSON.parse(cacheContentStr);
|
||||
} catch {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
try {
|
||||
zParsedCacheFile.parse(parsedCacheFile);
|
||||
} catch {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
assert(is<ParsedCacheFile>(parsedCacheFile));
|
||||
|
||||
return parsedCacheFile;
|
||||
})();
|
||||
|
||||
if (parsedCacheFile === undefined) {
|
||||
return [];
|
||||
}
|
||||
|
||||
if (parsedCacheFile.keycloakifyVersion !== keycloakifyVersion) {
|
||||
return [];
|
||||
}
|
||||
|
||||
if (parsedCacheFile.prettierConfigHash !== prettierConfigHash) {
|
||||
return [];
|
||||
}
|
||||
|
||||
if (parsedCacheFile.thisFilePath !== cacheFilePath) {
|
||||
return [];
|
||||
}
|
||||
|
||||
const uiModuleMetas_cacheUpToDate = parsedCacheFile.uiModuleMetas.filter(
|
||||
uiModuleMeta => {
|
||||
const correspondingInstalledUiModule = installedUiModules.find(
|
||||
installedUiModule =>
|
||||
installedUiModule.moduleName === uiModuleMeta.moduleName
|
||||
);
|
||||
|
||||
if (correspondingInstalledUiModule === undefined) {
|
||||
return false;
|
||||
}
|
||||
|
||||
return correspondingInstalledUiModule.version === uiModuleMeta.version;
|
||||
}
|
||||
);
|
||||
|
||||
return uiModuleMetas_cacheUpToDate;
|
||||
})();
|
||||
|
||||
const uiModuleMetas = await Promise.all(
|
||||
installedUiModules.map(
|
||||
async ({
|
||||
moduleName,
|
||||
version,
|
||||
peerDependencies,
|
||||
dirPath
|
||||
}): Promise<UiModuleMeta> => {
|
||||
use_cache: {
|
||||
const uiModuleMeta_cache = uiModuleMetas_cacheUpToDate.find(
|
||||
uiModuleMeta => uiModuleMeta.moduleName === moduleName
|
||||
);
|
||||
|
||||
if (uiModuleMeta_cache === undefined) {
|
||||
break use_cache;
|
||||
}
|
||||
|
||||
return uiModuleMeta_cache;
|
||||
}
|
||||
|
||||
const files: UiModuleMeta["files"] = [];
|
||||
|
||||
{
|
||||
const srcDirPath = pathJoin(dirPath, KEYCLOAK_THEME);
|
||||
|
||||
await crawlAsync({
|
||||
dirPath: srcDirPath,
|
||||
returnedPathsType: "relative to dirPath",
|
||||
onFileFound: async fileRelativePath => {
|
||||
const sourceCode =
|
||||
await getUiModuleFileSourceCodeReadyToBeCopied({
|
||||
buildContext,
|
||||
fileRelativePath,
|
||||
isForEjection: false,
|
||||
uiModuleDirPath: dirPath,
|
||||
uiModuleName: moduleName,
|
||||
uiModuleVersion: version
|
||||
});
|
||||
|
||||
const hash = computeHash(sourceCode);
|
||||
|
||||
const copyableFilePath = pathJoin(
|
||||
pathDirname(cacheFilePath),
|
||||
KEYCLOAK_THEME,
|
||||
fileRelativePath
|
||||
);
|
||||
|
||||
{
|
||||
const dirPath = pathDirname(copyableFilePath);
|
||||
|
||||
if (!(await existsAsync(dirPath))) {
|
||||
await fsPr.mkdir(dirPath, { recursive: true });
|
||||
}
|
||||
}
|
||||
|
||||
fsPr.writeFile(copyableFilePath, sourceCode);
|
||||
|
||||
files.push({
|
||||
fileRelativePath,
|
||||
hash,
|
||||
copyableFilePath
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return id<UiModuleMeta>({
|
||||
moduleName,
|
||||
version,
|
||||
files,
|
||||
peerDependencies
|
||||
});
|
||||
}
|
||||
)
|
||||
);
|
||||
|
||||
update_cache: {
|
||||
const parsedCacheFile = id<ParsedCacheFile>({
|
||||
keycloakifyVersion,
|
||||
prettierConfigHash,
|
||||
thisFilePath: cacheFilePath,
|
||||
uiModuleMetas
|
||||
});
|
||||
|
||||
const cacheContent_new = Buffer.from(
|
||||
JSON.stringify(parsedCacheFile, null, 2),
|
||||
"utf8"
|
||||
);
|
||||
|
||||
if (cacheContent !== undefined && cacheContent_new.equals(cacheContent)) {
|
||||
break update_cache;
|
||||
}
|
||||
|
||||
create_dir: {
|
||||
const dirPath = pathDirname(cacheFilePath);
|
||||
|
||||
if (await existsAsync(dirPath)) {
|
||||
break create_dir;
|
||||
}
|
||||
|
||||
await fsPr.mkdir(dirPath, { recursive: true });
|
||||
}
|
||||
|
||||
await fsPr.writeFile(cacheFilePath, cacheContent_new);
|
||||
}
|
||||
|
||||
return uiModuleMetas;
|
||||
}
|
||||
|
||||
export function computeHash(data: Buffer) {
|
||||
return crypto.createHash("sha256").update(data).digest("hex");
|
||||
}
|
||||
@ -7,9 +7,10 @@ import {
|
||||
dirname as pathDirname
|
||||
} from "path";
|
||||
import { getAbsoluteAndInOsFormatPath } from "../tools/getAbsoluteAndInOsFormatPath";
|
||||
import type { CliCommandOptions } from "../main";
|
||||
import { z } from "zod";
|
||||
import * as fs from "fs";
|
||||
import { assert, type Equals, is } from "tsafe/assert";
|
||||
import { assert, type Equals } from "tsafe/assert";
|
||||
import * as child_process from "child_process";
|
||||
import {
|
||||
VITE_PLUGIN_SUB_SCRIPTS_ENV_NAMES,
|
||||
@ -18,11 +19,13 @@ import {
|
||||
import type { KeycloakVersionRange } from "./KeycloakVersionRange";
|
||||
import { exclude } from "tsafe";
|
||||
import { crawl } from "../tools/crawl";
|
||||
import { THEME_TYPES, KEYCLOAK_THEME, type ThemeType } from "./constants";
|
||||
import { THEME_TYPES } from "./constants";
|
||||
import { objectEntries } from "tsafe/objectEntries";
|
||||
import { type ThemeType } from "./constants";
|
||||
import { id } from "tsafe/id";
|
||||
import chalk from "chalk";
|
||||
import { getProxyFetchOptions, type FetchOptionsLike } from "../tools/fetchProxyOptions";
|
||||
import { getProxyFetchOptions, type ProxyFetchOptions } from "../tools/fetchProxyOptions";
|
||||
import { is } from "tsafe/is";
|
||||
|
||||
export type BuildContext = {
|
||||
themeVersion: string;
|
||||
@ -40,7 +43,7 @@ export type BuildContext = {
|
||||
* In this case the urlPathname will be "/my-app/" */
|
||||
urlPathname: string | undefined;
|
||||
assetsDirPath: string;
|
||||
fetchOptions: FetchOptionsLike;
|
||||
fetchOptions: ProxyFetchOptions;
|
||||
kcContextExclusionsFtlCode: string | undefined;
|
||||
environmentVariables: { name: string; default: string }[];
|
||||
themeSrcDirPath: string;
|
||||
@ -50,7 +53,6 @@ export type BuildContext = {
|
||||
account:
|
||||
| { isImplemented: false }
|
||||
| { isImplemented: true; type: "Single-Page" | "Multi-Page" };
|
||||
admin: { isImplemented: boolean };
|
||||
};
|
||||
packageJsonFilePath: string;
|
||||
bundler: "vite" | "webpack";
|
||||
@ -127,12 +129,14 @@ export type ResolvedViteConfig = {
|
||||
};
|
||||
|
||||
export function getBuildContext(params: {
|
||||
projectDirPath: string | undefined;
|
||||
cliCommandOptions: CliCommandOptions;
|
||||
}): BuildContext {
|
||||
const { cliCommandOptions } = params;
|
||||
|
||||
const projectDirPath =
|
||||
params.projectDirPath !== undefined
|
||||
cliCommandOptions.projectDirPath !== undefined
|
||||
? getAbsoluteAndInOsFormatPath({
|
||||
pathIsh: params.projectDirPath,
|
||||
pathIsh: cliCommandOptions.projectDirPath,
|
||||
cwd: process.cwd()
|
||||
})
|
||||
: process.cwd();
|
||||
@ -145,10 +149,7 @@ export function getBuildContext(params: {
|
||||
returnedPathsType: "relative to dirPath"
|
||||
})
|
||||
.map(fileRelativePath => {
|
||||
for (const themeSrcDirBasename of [
|
||||
KEYCLOAK_THEME,
|
||||
KEYCLOAK_THEME.replace(/-/g, "_")
|
||||
]) {
|
||||
for (const themeSrcDirBasename of ["keycloak-theme", "keycloak_theme"]) {
|
||||
const split = fileRelativePath.split(themeSrcDirBasename);
|
||||
if (split.length === 2) {
|
||||
return pathJoin(srcDirPath, split[0] + themeSrcDirBasename);
|
||||
@ -174,7 +175,7 @@ export function getBuildContext(params: {
|
||||
[
|
||||
`Can't locate your Keycloak theme source directory in .${pathSep}${pathRelative(process.cwd(), srcDirPath)}`,
|
||||
`Make sure to either use the Keycloakify CLI in the root of your Keycloakify project or use the --project CLI option`,
|
||||
`If you are collocating your Keycloak theme with your app you must have a directory named '${KEYCLOAK_THEME}' or '${KEYCLOAK_THEME.replace(/-/g, "_")}' in your 'src' directory`
|
||||
`If you are collocating your Keycloak theme with your app you must have a directory named 'keycloak-theme' or 'keycloak_theme' in your 'src' directory`
|
||||
].join("\n")
|
||||
)
|
||||
);
|
||||
@ -240,7 +241,8 @@ export function getBuildContext(params: {
|
||||
|
||||
if (
|
||||
parsedPackageJson.dependencies?.keycloakify === undefined &&
|
||||
parsedPackageJson.devDependencies?.keycloakify === undefined
|
||||
parsedPackageJson.devDependencies?.keycloakify === undefined &&
|
||||
parsedPackageJson.name !== "keycloakify" // NOTE: For local storybook build
|
||||
) {
|
||||
break success;
|
||||
}
|
||||
@ -450,10 +452,7 @@ export function getBuildContext(params: {
|
||||
isImplemented: true,
|
||||
type: buildOptions.accountThemeImplementation
|
||||
};
|
||||
})(),
|
||||
admin: {
|
||||
isImplemented: fs.existsSync(pathJoin(themeSrcDirPath, "admin"))
|
||||
}
|
||||
})()
|
||||
};
|
||||
|
||||
if (
|
||||
@ -473,53 +472,26 @@ export function getBuildContext(params: {
|
||||
}
|
||||
|
||||
const themeNames = ((): [string, ...string[]] => {
|
||||
const themeNames = ((): [string, ...string[]] => {
|
||||
if (buildOptions.themeName === undefined) {
|
||||
return parsedPackageJson.name === undefined
|
||||
? ["keycloakify"]
|
||||
: [
|
||||
parsedPackageJson.name
|
||||
.replace(/^@(.*)/, "$1")
|
||||
.split("/")
|
||||
.join("-")
|
||||
];
|
||||
}
|
||||
|
||||
if (typeof buildOptions.themeName === "string") {
|
||||
return [buildOptions.themeName];
|
||||
}
|
||||
|
||||
const [mainThemeName, ...themeVariantNames] = buildOptions.themeName;
|
||||
|
||||
assert(mainThemeName !== undefined);
|
||||
|
||||
return [mainThemeName, ...themeVariantNames];
|
||||
})();
|
||||
|
||||
for (const themeName of themeNames) {
|
||||
if (!/^[a-zA-Z0-9_-]+$/.test(themeName)) {
|
||||
console.error(
|
||||
chalk.red(
|
||||
[
|
||||
`Invalid theme name: ${themeName}`,
|
||||
`Theme names should only contain letters, numbers, and "_" or "-"`
|
||||
].join(" ")
|
||||
)
|
||||
);
|
||||
process.exit(-1);
|
||||
}
|
||||
if (buildOptions.themeName === undefined) {
|
||||
return parsedPackageJson.name === undefined
|
||||
? ["keycloakify"]
|
||||
: [
|
||||
parsedPackageJson.name
|
||||
.replace(/^@(.*)/, "$1")
|
||||
.split("/")
|
||||
.join("-")
|
||||
];
|
||||
}
|
||||
|
||||
return themeNames;
|
||||
})();
|
||||
|
||||
const relativePathsCwd = (() => {
|
||||
switch (bundler) {
|
||||
case "vite":
|
||||
return projectDirPath;
|
||||
case "webpack":
|
||||
return pathDirname(packageJsonFilePath);
|
||||
if (typeof buildOptions.themeName === "string") {
|
||||
return [buildOptions.themeName];
|
||||
}
|
||||
|
||||
const [mainThemeName, ...themeVariantNames] = buildOptions.themeName;
|
||||
|
||||
assert(mainThemeName !== undefined);
|
||||
|
||||
return [mainThemeName, ...themeVariantNames];
|
||||
})();
|
||||
|
||||
const projectBuildDirPath = (() => {
|
||||
@ -533,7 +505,7 @@ export function getBuildContext(params: {
|
||||
if (parsedPackageJson.keycloakify.projectBuildDirPath !== undefined) {
|
||||
return getAbsoluteAndInOsFormatPath({
|
||||
pathIsh: parsedPackageJson.keycloakify.projectBuildDirPath,
|
||||
cwd: relativePathsCwd
|
||||
cwd: projectDirPath
|
||||
});
|
||||
}
|
||||
|
||||
@ -577,7 +549,7 @@ export function getBuildContext(params: {
|
||||
if (buildOptions.keycloakifyBuildDirPath !== undefined) {
|
||||
return getAbsoluteAndInOsFormatPath({
|
||||
pathIsh: buildOptions.keycloakifyBuildDirPath,
|
||||
cwd: relativePathsCwd
|
||||
cwd: projectDirPath
|
||||
});
|
||||
}
|
||||
|
||||
@ -606,7 +578,7 @@ export function getBuildContext(params: {
|
||||
if (parsedPackageJson.keycloakify.publicDirPath !== undefined) {
|
||||
return getAbsoluteAndInOsFormatPath({
|
||||
pathIsh: parsedPackageJson.keycloakify.publicDirPath,
|
||||
cwd: relativePathsCwd
|
||||
cwd: projectDirPath
|
||||
});
|
||||
}
|
||||
|
||||
@ -678,7 +650,7 @@ export function getBuildContext(params: {
|
||||
pathIsh:
|
||||
parsedPackageJson.keycloakify
|
||||
.staticDirPathInProjectBuildDirPath,
|
||||
cwd: relativePathsCwd
|
||||
cwd: projectBuildDirPath
|
||||
});
|
||||
}
|
||||
|
||||
@ -1006,7 +978,7 @@ export function getBuildContext(params: {
|
||||
type: "path",
|
||||
path: getAbsoluteAndInOsFormatPath({
|
||||
pathIsh: urlOrPath,
|
||||
cwd: relativePathsCwd
|
||||
cwd: projectDirPath
|
||||
})
|
||||
};
|
||||
}
|
||||
@ -1016,7 +988,7 @@ export function getBuildContext(params: {
|
||||
? undefined
|
||||
: getAbsoluteAndInOsFormatPath({
|
||||
pathIsh: buildOptions.startKeycloakOptions.realmJsonFilePath,
|
||||
cwd: relativePathsCwd
|
||||
cwd: projectDirPath
|
||||
}),
|
||||
port: buildOptions.startKeycloakOptions?.port
|
||||
}
|
||||
|
||||
@ -4,7 +4,7 @@ export const WELL_KNOWN_DIRECTORY_BASE_NAME = {
|
||||
DIST: "dist"
|
||||
} as const;
|
||||
|
||||
export const THEME_TYPES = ["login", "account", "admin"] as const;
|
||||
export const THEME_TYPES = ["login", "account"] as const;
|
||||
|
||||
export type ThemeType = (typeof THEME_TYPES)[number];
|
||||
|
||||
@ -71,10 +71,3 @@ export type AccountThemePageId = (typeof ACCOUNT_THEME_PAGE_IDS)[number];
|
||||
export const CONTAINER_NAME = "keycloak-keycloakify";
|
||||
|
||||
export const FALLBACK_LANGUAGE_TAG = "en";
|
||||
|
||||
export const CUSTOM_HANDLER_ENV_NAMES = {
|
||||
COMMAND_NAME: "KEYCLOAKIFY_COMMAND_NAME",
|
||||
BUILD_CONTEXT: "KEYCLOAKIFY_BUILD_CONTEXT"
|
||||
};
|
||||
|
||||
export const KEYCLOAK_THEME = "keycloak-theme";
|
||||
|
||||
95
src/bin/shared/copyKeycloakResourcesToPublic.ts
Normal file
95
src/bin/shared/copyKeycloakResourcesToPublic.ts
Normal file
@ -0,0 +1,95 @@
|
||||
import { join as pathJoin, dirname as pathDirname } from "path";
|
||||
import { WELL_KNOWN_DIRECTORY_BASE_NAME } from "../shared/constants";
|
||||
import { readThisNpmPackageVersion } from "../tools/readThisNpmPackageVersion";
|
||||
import { assert } from "tsafe/assert";
|
||||
import * as fs from "fs";
|
||||
import { rmSync } from "../tools/fs.rmSync";
|
||||
import type { BuildContext } from "./buildContext";
|
||||
import { transformCodebase } from "../tools/transformCodebase";
|
||||
import { getThisCodebaseRootDirPath } from "../tools/getThisCodebaseRootDirPath";
|
||||
|
||||
export type BuildContextLike = {
|
||||
publicDirPath: string;
|
||||
};
|
||||
|
||||
assert<BuildContext extends BuildContextLike ? true : false>();
|
||||
|
||||
export function copyKeycloakResourcesToPublic(params: {
|
||||
buildContext: BuildContextLike;
|
||||
}) {
|
||||
const { buildContext } = params;
|
||||
|
||||
const destDirPath = pathJoin(
|
||||
buildContext.publicDirPath,
|
||||
WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES
|
||||
);
|
||||
|
||||
const keycloakifyBuildinfoFilePath = pathJoin(destDirPath, "keycloakify.buildinfo");
|
||||
|
||||
const keycloakifyBuildinfoRaw = JSON.stringify(
|
||||
{
|
||||
keycloakifyVersion: readThisNpmPackageVersion()
|
||||
},
|
||||
null,
|
||||
2
|
||||
);
|
||||
|
||||
skip_if_already_done: {
|
||||
if (!fs.existsSync(keycloakifyBuildinfoFilePath)) {
|
||||
break skip_if_already_done;
|
||||
}
|
||||
|
||||
const keycloakifyBuildinfoRaw_previousRun = fs
|
||||
.readFileSync(keycloakifyBuildinfoFilePath)
|
||||
.toString("utf8");
|
||||
|
||||
if (keycloakifyBuildinfoRaw_previousRun !== keycloakifyBuildinfoRaw) {
|
||||
break skip_if_already_done;
|
||||
}
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
rmSync(destDirPath, { force: true, recursive: true });
|
||||
|
||||
// NOTE: To remove in a while, remove the legacy keycloak-resources directory
|
||||
rmSync(pathJoin(pathDirname(destDirPath), "keycloak-resources"), {
|
||||
force: true,
|
||||
recursive: true
|
||||
});
|
||||
rmSync(pathJoin(pathDirname(destDirPath), ".keycloakify"), {
|
||||
force: true,
|
||||
recursive: true
|
||||
});
|
||||
|
||||
fs.mkdirSync(destDirPath, { recursive: true });
|
||||
|
||||
fs.writeFileSync(pathJoin(destDirPath, ".gitignore"), Buffer.from("*", "utf8"));
|
||||
|
||||
transformCodebase({
|
||||
srcDirPath: pathJoin(
|
||||
getThisCodebaseRootDirPath(),
|
||||
"res",
|
||||
"public",
|
||||
WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES
|
||||
),
|
||||
destDirPath
|
||||
});
|
||||
|
||||
fs.writeFileSync(
|
||||
pathJoin(destDirPath, "README.txt"),
|
||||
Buffer.from(
|
||||
// prettier-ignore
|
||||
[
|
||||
"This directory is only used in dev mode by Keycloakify",
|
||||
"It won't be included in your final build.",
|
||||
"Do not modify anything in this directory.",
|
||||
].join("\n")
|
||||
)
|
||||
);
|
||||
|
||||
fs.writeFileSync(
|
||||
keycloakifyBuildinfoFilePath,
|
||||
Buffer.from(keycloakifyBuildinfoRaw, "utf8")
|
||||
);
|
||||
}
|
||||
@ -1,42 +0,0 @@
|
||||
import { assert } from "tsafe/assert";
|
||||
import type { BuildContext } from "./buildContext";
|
||||
import { CUSTOM_HANDLER_ENV_NAMES } from "./constants";
|
||||
|
||||
export const BIN_NAME = "_keycloakify-custom-handler";
|
||||
|
||||
export const NOT_IMPLEMENTED_EXIT_CODE = 78;
|
||||
|
||||
export type CommandName =
|
||||
| "update-kc-gen"
|
||||
| "eject-page"
|
||||
| "add-story"
|
||||
| "initialize-account-theme"
|
||||
| "initialize-admin-theme"
|
||||
| "initialize-email-theme"
|
||||
| "copy-keycloak-resources-to-public";
|
||||
|
||||
export type ApiVersion = "v1";
|
||||
|
||||
export function readParams(params: { apiVersion: ApiVersion }) {
|
||||
const { apiVersion } = params;
|
||||
|
||||
assert(apiVersion === "v1");
|
||||
|
||||
const commandName = (() => {
|
||||
const envValue = process.env[CUSTOM_HANDLER_ENV_NAMES.COMMAND_NAME];
|
||||
|
||||
assert(envValue !== undefined);
|
||||
|
||||
return envValue as CommandName;
|
||||
})();
|
||||
|
||||
const buildContext = (() => {
|
||||
const envValue = process.env[CUSTOM_HANDLER_ENV_NAMES.BUILD_CONTEXT];
|
||||
|
||||
assert(envValue !== undefined);
|
||||
|
||||
return JSON.parse(envValue) as BuildContext;
|
||||
})();
|
||||
|
||||
return { commandName, buildContext };
|
||||
}
|
||||
@ -1,48 +0,0 @@
|
||||
import { assert, type Equals } from "tsafe/assert";
|
||||
import type { BuildContext } from "./buildContext";
|
||||
import { CUSTOM_HANDLER_ENV_NAMES } from "./constants";
|
||||
import {
|
||||
NOT_IMPLEMENTED_EXIT_CODE,
|
||||
type CommandName,
|
||||
BIN_NAME,
|
||||
ApiVersion
|
||||
} from "./customHandler";
|
||||
import * as child_process from "child_process";
|
||||
import { getNodeModulesBinDirPath } from "../tools/nodeModulesBinDirPath";
|
||||
import * as fs from "fs";
|
||||
|
||||
assert<Equals<ApiVersion, "v1">>();
|
||||
|
||||
export function maybeDelegateCommandToCustomHandler(params: {
|
||||
commandName: CommandName;
|
||||
buildContext: BuildContext;
|
||||
}): { hasBeenHandled: boolean } {
|
||||
const { commandName, buildContext } = params;
|
||||
|
||||
const nodeModulesBinDirPath = getNodeModulesBinDirPath();
|
||||
|
||||
if (!fs.readdirSync(nodeModulesBinDirPath).includes(BIN_NAME)) {
|
||||
return { hasBeenHandled: false };
|
||||
}
|
||||
|
||||
try {
|
||||
child_process.execSync(`npx ${BIN_NAME}`, {
|
||||
stdio: "inherit",
|
||||
env: {
|
||||
...process.env,
|
||||
[CUSTOM_HANDLER_ENV_NAMES.COMMAND_NAME]: commandName,
|
||||
[CUSTOM_HANDLER_ENV_NAMES.BUILD_CONTEXT]: JSON.stringify(buildContext)
|
||||
}
|
||||
});
|
||||
} catch (error: any) {
|
||||
const status = error.status;
|
||||
|
||||
if (status === NOT_IMPLEMENTED_EXIT_CODE) {
|
||||
return { hasBeenHandled: false };
|
||||
}
|
||||
|
||||
process.exit(status);
|
||||
}
|
||||
|
||||
return { hasBeenHandled: true };
|
||||
}
|
||||
@ -1,36 +0,0 @@
|
||||
import child_process from "child_process";
|
||||
import chalk from "chalk";
|
||||
|
||||
export function exitIfUncommittedChanges(params: { projectDirPath: string }) {
|
||||
const { projectDirPath } = params;
|
||||
|
||||
let hasUncommittedChanges: boolean | undefined = undefined;
|
||||
|
||||
try {
|
||||
hasUncommittedChanges =
|
||||
child_process
|
||||
.execSync(`git status --porcelain`, {
|
||||
cwd: projectDirPath
|
||||
})
|
||||
.toString()
|
||||
.trim() !== "";
|
||||
} catch {
|
||||
// Probably not a git repository
|
||||
return;
|
||||
}
|
||||
|
||||
if (!hasUncommittedChanges) {
|
||||
return;
|
||||
}
|
||||
console.warn(
|
||||
[
|
||||
chalk.red(
|
||||
"Please commit or stash your changes before running this command.\n"
|
||||
),
|
||||
"This command will modify your project's files so it's better to have a clean working directory",
|
||||
"so that you can easily see what has been changed and revert if needed."
|
||||
].join(" ")
|
||||
);
|
||||
|
||||
process.exit(-1);
|
||||
}
|
||||
175
src/bin/shared/generateKcGenTs.ts
Normal file
175
src/bin/shared/generateKcGenTs.ts
Normal file
@ -0,0 +1,175 @@
|
||||
import { assert, type Equals } from "tsafe/assert";
|
||||
import { id } from "tsafe/id";
|
||||
import type { BuildContext } from "./buildContext";
|
||||
import * as fs from "fs/promises";
|
||||
import { join as pathJoin } from "path";
|
||||
import { existsAsync } from "../tools/fs.existsAsync";
|
||||
import { z } from "zod";
|
||||
|
||||
export type BuildContextLike = {
|
||||
projectDirPath: string;
|
||||
themeNames: string[];
|
||||
environmentVariables: { name: string; default: string }[];
|
||||
themeSrcDirPath: string;
|
||||
implementedThemeTypes: Pick<
|
||||
BuildContext["implementedThemeTypes"],
|
||||
"login" | "account"
|
||||
>;
|
||||
packageJsonFilePath: string;
|
||||
};
|
||||
|
||||
assert<BuildContext extends BuildContextLike ? true : false>();
|
||||
|
||||
export async function generateKcGenTs(params: {
|
||||
buildContext: BuildContextLike;
|
||||
}): Promise<void> {
|
||||
const { buildContext } = params;
|
||||
|
||||
const isReactProject: boolean = await (async () => {
|
||||
const parsedPackageJson = await (async () => {
|
||||
type ParsedPackageJson = {
|
||||
dependencies?: Record<string, string>;
|
||||
devDependencies?: Record<string, string>;
|
||||
};
|
||||
|
||||
const zParsedPackageJson = (() => {
|
||||
type TargetType = ParsedPackageJson;
|
||||
|
||||
const zTargetType = z.object({
|
||||
dependencies: z.record(z.string()).optional(),
|
||||
devDependencies: z.record(z.string()).optional()
|
||||
});
|
||||
|
||||
assert<Equals<z.infer<typeof zTargetType>, TargetType>>();
|
||||
|
||||
return id<z.ZodType<TargetType>>(zTargetType);
|
||||
})();
|
||||
|
||||
return zParsedPackageJson.parse(
|
||||
JSON.parse(
|
||||
(await fs.readFile(buildContext.packageJsonFilePath)).toString("utf8")
|
||||
)
|
||||
);
|
||||
})();
|
||||
|
||||
return (
|
||||
{
|
||||
...parsedPackageJson.dependencies,
|
||||
...parsedPackageJson.devDependencies
|
||||
}.react !== undefined
|
||||
);
|
||||
})();
|
||||
|
||||
const filePath = pathJoin(
|
||||
buildContext.themeSrcDirPath,
|
||||
`kc.gen.ts${isReactProject ? "x" : ""}`
|
||||
);
|
||||
|
||||
const currentContent = (await existsAsync(filePath))
|
||||
? await fs.readFile(filePath)
|
||||
: undefined;
|
||||
|
||||
const hasLoginTheme = buildContext.implementedThemeTypes.login.isImplemented;
|
||||
const hasAccountTheme = buildContext.implementedThemeTypes.account.isImplemented;
|
||||
|
||||
const newContent = Buffer.from(
|
||||
[
|
||||
`/* prettier-ignore-start */`,
|
||||
``,
|
||||
`/* eslint-disable */`,
|
||||
``,
|
||||
`// @ts-nocheck`,
|
||||
``,
|
||||
`// noinspection JSUnusedGlobalSymbols`,
|
||||
``,
|
||||
`// This file is auto-generated by Keycloakify`,
|
||||
``,
|
||||
isReactProject && `import { lazy, Suspense, type ReactNode } from "react";`,
|
||||
``,
|
||||
`export type ThemeName = ${buildContext.themeNames.map(themeName => `"${themeName}"`).join(" | ")};`,
|
||||
``,
|
||||
`export const themeNames: ThemeName[] = [${buildContext.themeNames.map(themeName => `"${themeName}"`).join(", ")}];`,
|
||||
``,
|
||||
`export type KcEnvName = ${buildContext.environmentVariables.length === 0 ? "never" : buildContext.environmentVariables.map(({ name }) => `"${name}"`).join(" | ")};`,
|
||||
``,
|
||||
`export const kcEnvNames: KcEnvName[] = [${buildContext.environmentVariables.map(({ name }) => `"${name}"`).join(", ")}];`,
|
||||
``,
|
||||
`export const kcEnvDefaults: Record<KcEnvName, string> = ${JSON.stringify(
|
||||
Object.fromEntries(
|
||||
buildContext.environmentVariables.map(
|
||||
({ name, default: defaultValue }) => [name, defaultValue]
|
||||
)
|
||||
),
|
||||
null,
|
||||
2
|
||||
)};`,
|
||||
``,
|
||||
`export type KcContext =`,
|
||||
hasLoginTheme && ` | import("./login/KcContext").KcContext`,
|
||||
hasAccountTheme && ` | import("./account/KcContext").KcContext`,
|
||||
` ;`,
|
||||
``,
|
||||
`declare global {`,
|
||||
` interface Window {`,
|
||||
` kcContext?: KcContext;`,
|
||||
` }`,
|
||||
`}`,
|
||||
``,
|
||||
...(!isReactProject
|
||||
? []
|
||||
: [
|
||||
hasLoginTheme &&
|
||||
`export const KcLoginPage = lazy(() => import("./login/KcPage"));`,
|
||||
hasAccountTheme &&
|
||||
`export const KcAccountPage = lazy(() => import("./account/KcPage"));`,
|
||||
``,
|
||||
`export function KcPage(`,
|
||||
` props: {`,
|
||||
` kcContext: KcContext;`,
|
||||
` fallback?: ReactNode;`,
|
||||
` }`,
|
||||
`) {`,
|
||||
` const { kcContext, fallback } = props;`,
|
||||
` return (`,
|
||||
` <Suspense fallback={fallback}>`,
|
||||
` {(() => {`,
|
||||
` switch (kcContext.themeType) {`,
|
||||
hasLoginTheme &&
|
||||
` case "login": return <KcLoginPage kcContext={kcContext} />;`,
|
||||
hasAccountTheme &&
|
||||
` case "account": return <KcAccountPage kcContext={kcContext} />;`,
|
||||
` }`,
|
||||
` })()}`,
|
||||
` </Suspense>`,
|
||||
` );`,
|
||||
`}`
|
||||
]),
|
||||
``,
|
||||
`/* prettier-ignore-end */`,
|
||||
``
|
||||
]
|
||||
.filter(item => typeof item === "string")
|
||||
.join("\n"),
|
||||
"utf8"
|
||||
);
|
||||
|
||||
if (currentContent !== undefined && currentContent.equals(newContent)) {
|
||||
return;
|
||||
}
|
||||
|
||||
await fs.writeFile(filePath, newContent);
|
||||
|
||||
delete_legacy_file: {
|
||||
if (!isReactProject) {
|
||||
break delete_legacy_file;
|
||||
}
|
||||
|
||||
const legacyFilePath = filePath.replace(/tsx$/, "ts");
|
||||
|
||||
if (!(await existsAsync(legacyFilePath))) {
|
||||
break delete_legacy_file;
|
||||
}
|
||||
|
||||
await fs.unlink(legacyFilePath);
|
||||
}
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,5 +1,6 @@
|
||||
import type { BuildContext } from "../shared/buildContext";
|
||||
import { getBuildContext } from "../shared/buildContext";
|
||||
import { exclude } from "tsafe/exclude";
|
||||
import type { CliCommandOptions as CliCommandOptions_common } from "../main";
|
||||
import { promptKeycloakVersion } from "../shared/promptKeycloakVersion";
|
||||
import { CONTAINER_NAME } from "../shared/constants";
|
||||
import { SemVer } from "../tools/SemVer";
|
||||
@ -28,14 +29,13 @@ import { existsAsync } from "../tools/fs.existsAsync";
|
||||
import { rm } from "../tools/fs.rm";
|
||||
import { downloadAndExtractArchive } from "../tools/downloadAndExtractArchive";
|
||||
|
||||
export async function command(params: {
|
||||
buildContext: BuildContext;
|
||||
cliCommandOptions: {
|
||||
port: number | undefined;
|
||||
keycloakVersion: string | undefined;
|
||||
realmJsonFilePath: string | undefined;
|
||||
};
|
||||
}) {
|
||||
export type CliCommandOptions = CliCommandOptions_common & {
|
||||
port: number | undefined;
|
||||
keycloakVersion: string | undefined;
|
||||
realmJsonFilePath: string | undefined;
|
||||
};
|
||||
|
||||
export async function command(params: { cliCommandOptions: CliCommandOptions }) {
|
||||
exit_if_docker_not_installed: {
|
||||
let commandOutput: string | undefined = undefined;
|
||||
|
||||
@ -88,7 +88,9 @@ export async function command(params: {
|
||||
process.exit(1);
|
||||
}
|
||||
|
||||
const { cliCommandOptions, buildContext } = params;
|
||||
const { cliCommandOptions } = params;
|
||||
|
||||
const buildContext = getBuildContext({ cliCommandOptions });
|
||||
|
||||
const { dockerImageTag } = await (async () => {
|
||||
if (cliCommandOptions.keycloakVersion !== undefined) {
|
||||
@ -396,12 +398,12 @@ export async function command(params: {
|
||||
...(realmJsonFilePath === undefined
|
||||
? []
|
||||
: [
|
||||
`-v${SPACE_PLACEHOLDER}"${realmJsonFilePath}":/opt/keycloak/data/import/myrealm-realm.json`
|
||||
`-v${SPACE_PLACEHOLDER}".${pathSep}${pathRelative(process.cwd(), realmJsonFilePath)}":/opt/keycloak/data/import/myrealm-realm.json`
|
||||
]),
|
||||
`-v${SPACE_PLACEHOLDER}"${jarFilePath_cacheDir}":/opt/keycloak/providers/keycloak-theme.jar`,
|
||||
`-v${SPACE_PLACEHOLDER}".${pathSep}${pathRelative(process.cwd(), jarFilePath_cacheDir)}":/opt/keycloak/providers/keycloak-theme.jar`,
|
||||
...extensionJarFilePaths.map(
|
||||
jarFilePath =>
|
||||
`-v${SPACE_PLACEHOLDER}"${jarFilePath}":/opt/keycloak/providers/${pathBasename(jarFilePath)}`
|
||||
`-v${SPACE_PLACEHOLDER}".${pathSep}${pathRelative(process.cwd(), jarFilePath)}":/opt/keycloak/providers/${pathBasename(jarFilePath)}`
|
||||
),
|
||||
...(keycloakMajorVersionNumber <= 20
|
||||
? [`-e${SPACE_PLACEHOLDER}JAVA_OPTS=-Dkeycloak.profile=preview`]
|
||||
@ -424,7 +426,7 @@ export async function command(params: {
|
||||
}))
|
||||
.map(
|
||||
({ localDirPath, containerDirPath }) =>
|
||||
`-v${SPACE_PLACEHOLDER}"${localDirPath}":${containerDirPath}:rw`
|
||||
`-v${SPACE_PLACEHOLDER}".${pathSep}${pathRelative(process.cwd(), localDirPath)}":${containerDirPath}:rw`
|
||||
),
|
||||
...buildContext.environmentVariables
|
||||
.map(({ name }) => ({ name, envValue: process.env[name] }))
|
||||
|
||||
@ -1,51 +0,0 @@
|
||||
import * as fsPr from "fs/promises";
|
||||
import { join as pathJoin, relative as pathRelative } from "path";
|
||||
import { assert, type Equals } from "tsafe/assert";
|
||||
|
||||
/** List all files in a given directory return paths relative to the dir_path */
|
||||
export async function crawlAsync(params: {
|
||||
dirPath: string;
|
||||
returnedPathsType: "absolute" | "relative to dirPath";
|
||||
onFileFound: (filePath: string) => Promise<void>;
|
||||
}) {
|
||||
const { dirPath, returnedPathsType, onFileFound } = params;
|
||||
|
||||
await crawlAsyncRec({
|
||||
dirPath,
|
||||
onFileFound: async ({ filePath }) => {
|
||||
switch (returnedPathsType) {
|
||||
case "absolute":
|
||||
await onFileFound(filePath);
|
||||
return;
|
||||
case "relative to dirPath":
|
||||
await onFileFound(pathRelative(dirPath, filePath));
|
||||
return;
|
||||
}
|
||||
assert<Equals<typeof returnedPathsType, never>>();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
async function crawlAsyncRec(params: {
|
||||
dirPath: string;
|
||||
onFileFound: (params: { filePath: string }) => Promise<void>;
|
||||
}) {
|
||||
const { dirPath, onFileFound } = params;
|
||||
|
||||
await Promise.all(
|
||||
(await fsPr.readdir(dirPath)).map(async basename => {
|
||||
const fileOrDirPath = pathJoin(dirPath, basename);
|
||||
|
||||
const isDirectory = await fsPr
|
||||
.lstat(fileOrDirPath)
|
||||
.then(stat => stat.isDirectory());
|
||||
|
||||
if (isDirectory) {
|
||||
await crawlAsyncRec({ dirPath: fileOrDirPath, onFileFound });
|
||||
return;
|
||||
}
|
||||
|
||||
await onFileFound({ filePath: fileOrDirPath });
|
||||
})
|
||||
);
|
||||
}
|
||||
@ -1,18 +1,16 @@
|
||||
import { type FetchOptions } from "make-fetch-happen";
|
||||
import * as child_process from "child_process";
|
||||
import * as fs from "fs";
|
||||
import { exclude } from "tsafe/exclude";
|
||||
|
||||
export type FetchOptionsLike = {
|
||||
proxy: string | undefined;
|
||||
noProxy: string | string[];
|
||||
strictSSL: boolean;
|
||||
cert: string | string[] | undefined;
|
||||
ca: string[] | undefined;
|
||||
};
|
||||
export type ProxyFetchOptions = Pick<
|
||||
FetchOptions,
|
||||
"proxy" | "noProxy" | "strictSSL" | "cert" | "ca"
|
||||
>;
|
||||
|
||||
export function getProxyFetchOptions(params: {
|
||||
npmConfigGetCwd: string;
|
||||
}): FetchOptionsLike {
|
||||
}): ProxyFetchOptions {
|
||||
const { npmConfigGetCwd } = params;
|
||||
|
||||
const cfg = (() => {
|
||||
|
||||
@ -1,51 +0,0 @@
|
||||
import { join as pathJoin } from "path";
|
||||
import { existsAsync } from "./fs.existsAsync";
|
||||
import * as child_process from "child_process";
|
||||
import { assert } from "tsafe/assert";
|
||||
|
||||
export async function getInstalledModuleDirPath(params: {
|
||||
moduleName: string;
|
||||
packageJsonDirPath: string;
|
||||
projectDirPath: string;
|
||||
}) {
|
||||
const { moduleName, packageJsonDirPath, projectDirPath } = params;
|
||||
|
||||
common_case: {
|
||||
const dirPath = pathJoin(
|
||||
...[packageJsonDirPath, "node_modules", ...moduleName.split("/")]
|
||||
);
|
||||
|
||||
if (!(await existsAsync(dirPath))) {
|
||||
break common_case;
|
||||
}
|
||||
|
||||
return dirPath;
|
||||
}
|
||||
|
||||
node_modules_at_root_case: {
|
||||
if (projectDirPath === packageJsonDirPath) {
|
||||
break node_modules_at_root_case;
|
||||
}
|
||||
|
||||
const dirPath = pathJoin(
|
||||
...[projectDirPath, "node_modules", ...moduleName.split("/")]
|
||||
);
|
||||
|
||||
if (!(await existsAsync(dirPath))) {
|
||||
break node_modules_at_root_case;
|
||||
}
|
||||
|
||||
return dirPath;
|
||||
}
|
||||
|
||||
const dirPath = child_process
|
||||
.execSync(`npm list ${moduleName}`, {
|
||||
cwd: packageJsonDirPath
|
||||
})
|
||||
.toString("utf8")
|
||||
.trim();
|
||||
|
||||
assert(dirPath !== "");
|
||||
|
||||
return dirPath;
|
||||
}
|
||||
@ -1,29 +0,0 @@
|
||||
import * as child_process from "child_process";
|
||||
import { dirname as pathDirname, basename as pathBasename } from "path";
|
||||
import { Deferred } from "evt/tools/Deferred";
|
||||
|
||||
export function getIsTrackedByGit(params: { filePath: string }): Promise<boolean> {
|
||||
const { filePath } = params;
|
||||
|
||||
const dIsTracked = new Deferred<boolean>();
|
||||
|
||||
child_process.exec(
|
||||
`git ls-files --error-unmatch ${pathBasename(filePath)}`,
|
||||
{ cwd: pathDirname(filePath) },
|
||||
error => {
|
||||
if (error === null) {
|
||||
dIsTracked.resolve(true);
|
||||
return;
|
||||
}
|
||||
|
||||
if (error.code === 1) {
|
||||
dIsTracked.resolve(false);
|
||||
return;
|
||||
}
|
||||
|
||||
dIsTracked.reject(error);
|
||||
}
|
||||
);
|
||||
|
||||
return dIsTracked.pr;
|
||||
}
|
||||
@ -1,130 +0,0 @@
|
||||
import { assert, type Equals, is } from "tsafe/assert";
|
||||
import { id } from "tsafe/id";
|
||||
import { z } from "zod";
|
||||
import { join as pathJoin, dirname as pathDirname } from "path";
|
||||
import * as fsPr from "fs/promises";
|
||||
import { getInstalledModuleDirPath } from "../tools/getInstalledModuleDirPath";
|
||||
import { exclude } from "tsafe/exclude";
|
||||
|
||||
export async function listInstalledModules(params: {
|
||||
packageJsonFilePath: string;
|
||||
projectDirPath: string;
|
||||
filter: (params: { moduleName: string }) => boolean;
|
||||
}): Promise<
|
||||
{
|
||||
moduleName: string;
|
||||
version: string;
|
||||
dirPath: string;
|
||||
peerDependencies: Record<string, string>;
|
||||
}[]
|
||||
> {
|
||||
const { packageJsonFilePath, projectDirPath, filter } = params;
|
||||
|
||||
const parsedPackageJson = await readPackageJsonDependencies({
|
||||
packageJsonFilePath
|
||||
});
|
||||
|
||||
const uiModuleNames = (
|
||||
[parsedPackageJson.dependencies, parsedPackageJson.devDependencies] as const
|
||||
)
|
||||
.filter(exclude(undefined))
|
||||
.map(obj => Object.keys(obj))
|
||||
.flat()
|
||||
.filter(moduleName => filter({ moduleName }));
|
||||
|
||||
const result = await Promise.all(
|
||||
uiModuleNames.map(async moduleName => {
|
||||
const dirPath = await getInstalledModuleDirPath({
|
||||
moduleName,
|
||||
packageJsonDirPath: pathDirname(packageJsonFilePath),
|
||||
projectDirPath
|
||||
});
|
||||
|
||||
const { version, peerDependencies } =
|
||||
await readPackageJsonVersionAndPeerDependencies({
|
||||
packageJsonFilePath: pathJoin(dirPath, "package.json")
|
||||
});
|
||||
|
||||
return { moduleName, version, peerDependencies, dirPath } as const;
|
||||
})
|
||||
);
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
const { readPackageJsonDependencies } = (() => {
|
||||
type ParsedPackageJson = {
|
||||
dependencies?: Record<string, string>;
|
||||
devDependencies?: Record<string, string>;
|
||||
};
|
||||
|
||||
const zParsedPackageJson = (() => {
|
||||
type TargetType = ParsedPackageJson;
|
||||
|
||||
const zTargetType = z.object({
|
||||
dependencies: z.record(z.string()).optional(),
|
||||
devDependencies: z.record(z.string()).optional()
|
||||
});
|
||||
|
||||
assert<Equals<z.infer<typeof zTargetType>, TargetType>>();
|
||||
|
||||
return id<z.ZodType<TargetType>>(zTargetType);
|
||||
})();
|
||||
|
||||
async function readPackageJsonDependencies(params: { packageJsonFilePath: string }) {
|
||||
const { packageJsonFilePath } = params;
|
||||
|
||||
const parsedPackageJson = JSON.parse(
|
||||
(await fsPr.readFile(packageJsonFilePath)).toString("utf8")
|
||||
);
|
||||
|
||||
zParsedPackageJson.parse(parsedPackageJson);
|
||||
|
||||
assert(is<ParsedPackageJson>(parsedPackageJson));
|
||||
|
||||
return parsedPackageJson;
|
||||
}
|
||||
|
||||
return { readPackageJsonDependencies };
|
||||
})();
|
||||
|
||||
const { readPackageJsonVersionAndPeerDependencies } = (() => {
|
||||
type ParsedPackageJson = {
|
||||
version: string;
|
||||
peerDependencies?: Record<string, string>;
|
||||
};
|
||||
|
||||
const zParsedPackageJson = (() => {
|
||||
type TargetType = ParsedPackageJson;
|
||||
|
||||
const zTargetType = z.object({
|
||||
version: z.string(),
|
||||
peerDependencies: z.record(z.string()).optional()
|
||||
});
|
||||
|
||||
assert<Equals<z.infer<typeof zTargetType>, TargetType>>();
|
||||
|
||||
return id<z.ZodType<TargetType>>(zTargetType);
|
||||
})();
|
||||
|
||||
async function readPackageJsonVersionAndPeerDependencies(params: {
|
||||
packageJsonFilePath: string;
|
||||
}): Promise<{ version: string; peerDependencies: Record<string, string> }> {
|
||||
const { packageJsonFilePath } = params;
|
||||
|
||||
const parsedPackageJson = JSON.parse(
|
||||
(await fsPr.readFile(packageJsonFilePath)).toString("utf8")
|
||||
);
|
||||
|
||||
zParsedPackageJson.parse(parsedPackageJson);
|
||||
|
||||
assert(is<ParsedPackageJson>(parsedPackageJson));
|
||||
|
||||
return {
|
||||
version: parsedPackageJson.version,
|
||||
peerDependencies: parsedPackageJson.peerDependencies ?? {}
|
||||
};
|
||||
}
|
||||
|
||||
return { readPackageJsonVersionAndPeerDependencies };
|
||||
})();
|
||||
@ -1,38 +0,0 @@
|
||||
import { sep as pathSep } from "path";
|
||||
|
||||
let cache: string | undefined = undefined;
|
||||
|
||||
export function getNodeModulesBinDirPath() {
|
||||
if (cache !== undefined) {
|
||||
return cache;
|
||||
}
|
||||
|
||||
const binPath = process.argv[1];
|
||||
|
||||
const segments: string[] = [".bin"];
|
||||
|
||||
let foundNodeModules = false;
|
||||
|
||||
for (const segment of binPath.split(pathSep).reverse()) {
|
||||
skip_segment: {
|
||||
if (foundNodeModules) {
|
||||
break skip_segment;
|
||||
}
|
||||
|
||||
if (segment === "node_modules") {
|
||||
foundNodeModules = true;
|
||||
break skip_segment;
|
||||
}
|
||||
|
||||
continue;
|
||||
}
|
||||
|
||||
segments.unshift(segment);
|
||||
}
|
||||
|
||||
const nodeModulesBinDirPath = segments.join(pathSep);
|
||||
|
||||
cache = nodeModulesBinDirPath;
|
||||
|
||||
return nodeModulesBinDirPath;
|
||||
}
|
||||
@ -1,14 +1,7 @@
|
||||
import * as fs from "fs";
|
||||
import { join as pathJoin, dirname as pathDirname } from "path";
|
||||
import { join as pathJoin } from "path";
|
||||
import * as child_process from "child_process";
|
||||
import chalk from "chalk";
|
||||
import { z } from "zod";
|
||||
import { assert, type Equals, is } from "tsafe/assert";
|
||||
import { id } from "tsafe/id";
|
||||
import { objectKeys } from "tsafe/objectKeys";
|
||||
import { getAbsoluteAndInOsFormatPath } from "./getAbsoluteAndInOsFormatPath";
|
||||
import { exclude } from "tsafe/exclude";
|
||||
import { rmSync } from "./fs.rmSync";
|
||||
|
||||
export function npmInstall(params: { packageJsonDirPath: string }) {
|
||||
const { packageJsonDirPath } = params;
|
||||
@ -30,10 +23,6 @@ export function npmInstall(params: { packageJsonDirPath: string }) {
|
||||
{
|
||||
binName: "bun",
|
||||
lockFileBasename: "bun.lockdb"
|
||||
},
|
||||
{
|
||||
binName: "deno",
|
||||
lockFileBasename: "deno.lock"
|
||||
}
|
||||
] as const;
|
||||
|
||||
@ -48,411 +37,27 @@ export function npmInstall(params: { packageJsonDirPath: string }) {
|
||||
}
|
||||
}
|
||||
|
||||
throw new Error(
|
||||
"No lock file found, cannot tell which package manager to use for installing dependencies."
|
||||
);
|
||||
return undefined;
|
||||
})();
|
||||
|
||||
console.log(`Installing the new dependencies...`);
|
||||
|
||||
install_without_breaking_links: {
|
||||
if (packageManagerBinName !== "yarn") {
|
||||
break install_without_breaking_links;
|
||||
install_dependencies: {
|
||||
if (packageManagerBinName === undefined) {
|
||||
break install_dependencies;
|
||||
}
|
||||
|
||||
const garronejLinkInfos = getGarronejLinkInfos({ packageJsonDirPath });
|
||||
|
||||
if (garronejLinkInfos === undefined) {
|
||||
break install_without_breaking_links;
|
||||
}
|
||||
|
||||
console.log(chalk.green("Installing in a way that won't break the links..."));
|
||||
|
||||
installWithoutBreakingLinks({
|
||||
packageJsonDirPath,
|
||||
garronejLinkInfos
|
||||
});
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
child_process.execSync(`${packageManagerBinName} install`, {
|
||||
cwd: packageJsonDirPath,
|
||||
stdio: "inherit"
|
||||
});
|
||||
} catch {
|
||||
console.log(
|
||||
chalk.yellow(
|
||||
`\`${packageManagerBinName} install\` failed, continuing anyway...`
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
function getGarronejLinkInfos(params: {
|
||||
packageJsonDirPath: string;
|
||||
}): { linkedModuleNames: string[]; yarnHomeDirPath: string } | undefined {
|
||||
const { packageJsonDirPath } = params;
|
||||
|
||||
const nodeModuleDirPath = pathJoin(packageJsonDirPath, "node_modules");
|
||||
|
||||
if (!fs.existsSync(nodeModuleDirPath)) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
const linkedModuleNames: string[] = [];
|
||||
|
||||
let yarnHomeDirPath: string | undefined = undefined;
|
||||
|
||||
const getIsLinkedByGarronejScript = (path: string) => {
|
||||
let realPath: string;
|
||||
console.log(`Installing the new dependencies...`);
|
||||
|
||||
try {
|
||||
realPath = fs.readlinkSync(path);
|
||||
} catch {
|
||||
return false;
|
||||
}
|
||||
|
||||
const doesIncludeYarnHome = realPath.includes(".yarn_home");
|
||||
|
||||
if (!doesIncludeYarnHome) {
|
||||
return false;
|
||||
}
|
||||
|
||||
set_yarnHomeDirPath: {
|
||||
if (yarnHomeDirPath !== undefined) {
|
||||
break set_yarnHomeDirPath;
|
||||
}
|
||||
|
||||
const [firstElement] = getAbsoluteAndInOsFormatPath({
|
||||
pathIsh: realPath,
|
||||
cwd: pathDirname(path)
|
||||
}).split(".yarn_home");
|
||||
|
||||
yarnHomeDirPath = pathJoin(firstElement, ".yarn_home");
|
||||
}
|
||||
|
||||
return true;
|
||||
};
|
||||
|
||||
for (const basename of fs.readdirSync(nodeModuleDirPath)) {
|
||||
const path = pathJoin(nodeModuleDirPath, basename);
|
||||
|
||||
if (fs.lstatSync(path).isSymbolicLink()) {
|
||||
if (basename.startsWith("@")) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
if (!getIsLinkedByGarronejScript(path)) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
linkedModuleNames.push(basename);
|
||||
continue;
|
||||
}
|
||||
|
||||
if (!fs.lstatSync(path).isDirectory()) {
|
||||
continue;
|
||||
}
|
||||
|
||||
if (basename.startsWith("@")) {
|
||||
for (const subBasename of fs.readdirSync(path)) {
|
||||
const subPath = pathJoin(path, subBasename);
|
||||
|
||||
if (!fs.lstatSync(subPath).isSymbolicLink()) {
|
||||
continue;
|
||||
}
|
||||
|
||||
if (!getIsLinkedByGarronejScript(subPath)) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
linkedModuleNames.push(`${basename}/${subBasename}`);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (yarnHomeDirPath === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
return { linkedModuleNames, yarnHomeDirPath };
|
||||
}
|
||||
|
||||
function installWithoutBreakingLinks(params: {
|
||||
packageJsonDirPath: string;
|
||||
garronejLinkInfos: Exclude<ReturnType<typeof getGarronejLinkInfos>, undefined>;
|
||||
}) {
|
||||
const {
|
||||
packageJsonDirPath,
|
||||
garronejLinkInfos: { linkedModuleNames, yarnHomeDirPath }
|
||||
} = params;
|
||||
|
||||
const parsedPackageJson = (() => {
|
||||
const packageJsonFilePath = pathJoin(packageJsonDirPath, "package.json");
|
||||
|
||||
type ParsedPackageJson = {
|
||||
scripts?: Record<string, string>;
|
||||
};
|
||||
|
||||
const zParsedPackageJson = (() => {
|
||||
type TargetType = ParsedPackageJson;
|
||||
|
||||
const zTargetType = z.object({
|
||||
scripts: z.record(z.string()).optional()
|
||||
child_process.execSync(`${packageManagerBinName} install`, {
|
||||
cwd: packageJsonDirPath,
|
||||
stdio: "inherit"
|
||||
});
|
||||
|
||||
type InferredType = z.infer<typeof zTargetType>;
|
||||
|
||||
assert<Equals<TargetType, InferredType>>;
|
||||
|
||||
return id<z.ZodType<TargetType>>(zTargetType);
|
||||
})();
|
||||
|
||||
const parsedPackageJson = JSON.parse(
|
||||
fs.readFileSync(packageJsonFilePath).toString("utf8")
|
||||
) as unknown;
|
||||
|
||||
zParsedPackageJson.parse(parsedPackageJson);
|
||||
assert(is<ParsedPackageJson>(parsedPackageJson));
|
||||
|
||||
return parsedPackageJson;
|
||||
})();
|
||||
|
||||
const isImplementedScriptByName = {
|
||||
postinstall: false,
|
||||
prepare: false
|
||||
};
|
||||
|
||||
delete_postinstall_script: {
|
||||
if (parsedPackageJson.scripts === undefined) {
|
||||
break delete_postinstall_script;
|
||||
} catch {
|
||||
console.log(
|
||||
chalk.yellow(
|
||||
`\`${packageManagerBinName} install\` failed, continuing anyway...`
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
for (const scriptName of objectKeys(isImplementedScriptByName)) {
|
||||
if (parsedPackageJson.scripts[scriptName] === undefined) {
|
||||
continue;
|
||||
}
|
||||
|
||||
isImplementedScriptByName[scriptName] = true;
|
||||
|
||||
delete parsedPackageJson.scripts[scriptName];
|
||||
}
|
||||
}
|
||||
|
||||
const tmpProjectDirPath = pathJoin(yarnHomeDirPath, "tmpProject");
|
||||
|
||||
if (fs.existsSync(tmpProjectDirPath)) {
|
||||
rmSync(tmpProjectDirPath, { recursive: true });
|
||||
}
|
||||
|
||||
fs.mkdirSync(tmpProjectDirPath, { recursive: true });
|
||||
|
||||
fs.writeFileSync(
|
||||
pathJoin(tmpProjectDirPath, "package.json"),
|
||||
JSON.stringify(parsedPackageJson, undefined, 4)
|
||||
);
|
||||
|
||||
const YARN_LOCK = "yarn.lock";
|
||||
|
||||
fs.copyFileSync(
|
||||
pathJoin(packageJsonDirPath, YARN_LOCK),
|
||||
pathJoin(tmpProjectDirPath, YARN_LOCK)
|
||||
);
|
||||
|
||||
child_process.execSync(`yarn install`, {
|
||||
cwd: tmpProjectDirPath,
|
||||
stdio: "inherit"
|
||||
});
|
||||
|
||||
// NOTE: Moving the modules from the tmp project to the actual project
|
||||
// without messing up the links.
|
||||
{
|
||||
const { getAreSameVersions } = (() => {
|
||||
type ParsedPackageJson = {
|
||||
version: string;
|
||||
};
|
||||
|
||||
const zParsedPackageJson = (() => {
|
||||
type TargetType = ParsedPackageJson;
|
||||
|
||||
const zTargetType = z.object({
|
||||
version: z.string()
|
||||
});
|
||||
|
||||
type InferredType = z.infer<typeof zTargetType>;
|
||||
|
||||
assert<Equals<TargetType, InferredType>>;
|
||||
|
||||
return id<z.ZodType<TargetType>>(zTargetType);
|
||||
})();
|
||||
|
||||
function readVersion(params: { moduleDirPath: string }): string {
|
||||
const { moduleDirPath } = params;
|
||||
|
||||
const packageJsonFilePath = pathJoin(moduleDirPath, "package.json");
|
||||
|
||||
const packageJson = JSON.parse(
|
||||
fs.readFileSync(packageJsonFilePath).toString("utf8")
|
||||
);
|
||||
|
||||
zParsedPackageJson.parse(packageJson);
|
||||
assert(is<ParsedPackageJson>(packageJson));
|
||||
|
||||
return packageJson.version;
|
||||
}
|
||||
|
||||
function getAreSameVersions(params: {
|
||||
moduleDirPath_a: string;
|
||||
moduleDirPath_b: string;
|
||||
}): boolean {
|
||||
const { moduleDirPath_a, moduleDirPath_b } = params;
|
||||
|
||||
return (
|
||||
readVersion({ moduleDirPath: moduleDirPath_a }) ===
|
||||
readVersion({ moduleDirPath: moduleDirPath_b })
|
||||
);
|
||||
}
|
||||
|
||||
return { getAreSameVersions };
|
||||
})();
|
||||
|
||||
const nodeModulesDirPath_tmpProject = pathJoin(tmpProjectDirPath, "node_modules");
|
||||
const nodeModulesDirPath = pathJoin(packageJsonDirPath, "node_modules");
|
||||
|
||||
const modulePaths = fs
|
||||
.readdirSync(nodeModulesDirPath_tmpProject)
|
||||
.map(basename => {
|
||||
if (basename.startsWith(".")) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
const path = pathJoin(nodeModulesDirPath_tmpProject, basename);
|
||||
|
||||
if (basename.startsWith("@")) {
|
||||
return fs
|
||||
.readdirSync(path)
|
||||
.map(subBasename => {
|
||||
if (subBasename.startsWith(".")) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
const subPath = pathJoin(path, subBasename);
|
||||
|
||||
if (!fs.lstatSync(subPath).isDirectory()) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
return {
|
||||
moduleName: `${basename}/${subBasename}`,
|
||||
moduleDirPath_tmpProject: subPath,
|
||||
moduleDirPath: pathJoin(
|
||||
nodeModulesDirPath,
|
||||
basename,
|
||||
subBasename
|
||||
)
|
||||
};
|
||||
})
|
||||
.filter(exclude(undefined));
|
||||
}
|
||||
|
||||
if (!fs.lstatSync(path).isDirectory()) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
return [
|
||||
{
|
||||
moduleName: basename,
|
||||
moduleDirPath_tmpProject: path,
|
||||
moduleDirPath: pathJoin(nodeModulesDirPath, basename)
|
||||
}
|
||||
];
|
||||
})
|
||||
.filter(exclude(undefined))
|
||||
.flat();
|
||||
|
||||
for (const {
|
||||
moduleName,
|
||||
moduleDirPath,
|
||||
moduleDirPath_tmpProject
|
||||
} of modulePaths) {
|
||||
if (linkedModuleNames.includes(moduleName)) {
|
||||
continue;
|
||||
}
|
||||
|
||||
let doesTargetModuleExist = false;
|
||||
|
||||
skip_condition: {
|
||||
if (!fs.existsSync(moduleDirPath)) {
|
||||
break skip_condition;
|
||||
}
|
||||
|
||||
doesTargetModuleExist = true;
|
||||
|
||||
const areSameVersions = getAreSameVersions({
|
||||
moduleDirPath_a: moduleDirPath,
|
||||
moduleDirPath_b: moduleDirPath_tmpProject
|
||||
});
|
||||
|
||||
if (!areSameVersions) {
|
||||
break skip_condition;
|
||||
}
|
||||
|
||||
continue;
|
||||
}
|
||||
|
||||
if (doesTargetModuleExist) {
|
||||
rmSync(moduleDirPath, { recursive: true });
|
||||
}
|
||||
|
||||
{
|
||||
const dirPath = pathDirname(moduleDirPath);
|
||||
|
||||
if (!fs.existsSync(dirPath)) {
|
||||
fs.mkdirSync(dirPath, { recursive: true });
|
||||
}
|
||||
}
|
||||
|
||||
fs.renameSync(moduleDirPath_tmpProject, moduleDirPath);
|
||||
}
|
||||
|
||||
move_bin: {
|
||||
const binDirPath_tmpProject = pathJoin(nodeModulesDirPath_tmpProject, ".bin");
|
||||
const binDirPath = pathJoin(nodeModulesDirPath, ".bin");
|
||||
|
||||
if (!fs.existsSync(binDirPath_tmpProject)) {
|
||||
break move_bin;
|
||||
}
|
||||
|
||||
for (const basename of fs.readdirSync(binDirPath_tmpProject)) {
|
||||
const path_tmpProject = pathJoin(binDirPath_tmpProject, basename);
|
||||
const path = pathJoin(binDirPath, basename);
|
||||
|
||||
if (fs.existsSync(path)) {
|
||||
continue;
|
||||
}
|
||||
|
||||
fs.renameSync(path_tmpProject, path);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
fs.cpSync(
|
||||
pathJoin(tmpProjectDirPath, YARN_LOCK),
|
||||
pathJoin(packageJsonDirPath, YARN_LOCK)
|
||||
);
|
||||
|
||||
rmSync(tmpProjectDirPath, { recursive: true });
|
||||
|
||||
for (const scriptName of objectKeys(isImplementedScriptByName)) {
|
||||
if (!isImplementedScriptByName[scriptName]) {
|
||||
continue;
|
||||
}
|
||||
|
||||
child_process.execSync(`yarn run ${scriptName}`, {
|
||||
cwd: packageJsonDirPath,
|
||||
stdio: "inherit"
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@ -3,13 +3,7 @@ import { assert } from "tsafe/assert";
|
||||
import * as fs from "fs";
|
||||
import { join as pathJoin } from "path";
|
||||
|
||||
let cache: string | undefined = undefined;
|
||||
|
||||
export function readThisNpmPackageVersion(): string {
|
||||
if (cache !== undefined) {
|
||||
return cache;
|
||||
}
|
||||
|
||||
const version = JSON.parse(
|
||||
fs
|
||||
.readFileSync(pathJoin(getThisCodebaseRootDirPath(), "package.json"))
|
||||
@ -18,7 +12,5 @@ export function readThisNpmPackageVersion(): string {
|
||||
|
||||
assert(typeof version === "string");
|
||||
|
||||
cache = version;
|
||||
|
||||
return version;
|
||||
}
|
||||
|
||||
@ -1,126 +0,0 @@
|
||||
import { getNodeModulesBinDirPath } from "./nodeModulesBinDirPath";
|
||||
import { join as pathJoin, resolve as pathResolve } from "path";
|
||||
import * as fsPr from "fs/promises";
|
||||
import { id } from "tsafe/id";
|
||||
import { assert, is } from "tsafe/assert";
|
||||
import chalk from "chalk";
|
||||
import * as crypto from "crypto";
|
||||
import { symToStr } from "tsafe/symToStr";
|
||||
import { readThisNpmPackageVersion } from "./readThisNpmPackageVersion";
|
||||
|
||||
getIsPrettierAvailable.cache = id<boolean | undefined>(undefined);
|
||||
|
||||
export async function getIsPrettierAvailable(): Promise<boolean> {
|
||||
if (getIsPrettierAvailable.cache !== undefined) {
|
||||
return getIsPrettierAvailable.cache;
|
||||
}
|
||||
|
||||
const nodeModulesBinDirPath = getNodeModulesBinDirPath();
|
||||
|
||||
const prettierBinPath = pathJoin(nodeModulesBinDirPath, "prettier");
|
||||
|
||||
const stats = await fsPr.stat(prettierBinPath).catch(() => undefined);
|
||||
|
||||
const isPrettierAvailable = stats?.isFile() ?? false;
|
||||
|
||||
getIsPrettierAvailable.cache = isPrettierAvailable;
|
||||
|
||||
return isPrettierAvailable;
|
||||
}
|
||||
|
||||
type PrettierAndConfigHash = {
|
||||
prettier: typeof import("prettier");
|
||||
configHash: string;
|
||||
};
|
||||
|
||||
getPrettier.cache = id<PrettierAndConfigHash | undefined>(undefined);
|
||||
|
||||
export async function getPrettier(): Promise<PrettierAndConfigHash> {
|
||||
assert(getIsPrettierAvailable());
|
||||
|
||||
if (getPrettier.cache !== undefined) {
|
||||
return getPrettier.cache;
|
||||
}
|
||||
|
||||
let prettier = id<typeof import("prettier") | undefined>(undefined);
|
||||
|
||||
import_prettier: {
|
||||
// NOTE: When module is linked we want to make sure we import the correct version
|
||||
// of prettier, that is the one of the project, not the one of this repo.
|
||||
// So we do a sketchy eval to bypass ncc.
|
||||
// We make sure to only do that when linking, otherwise we import properly.
|
||||
if (readThisNpmPackageVersion().startsWith("0.0.0")) {
|
||||
eval(
|
||||
`${symToStr({ prettier })} = require("${pathResolve(pathJoin(getNodeModulesBinDirPath(), "..", "prettier"))}")`
|
||||
);
|
||||
|
||||
assert(!is<undefined>(prettier));
|
||||
|
||||
break import_prettier;
|
||||
}
|
||||
|
||||
prettier = await import("prettier");
|
||||
}
|
||||
|
||||
const configHash = await (async () => {
|
||||
const configFilePath = await prettier.resolveConfigFile(
|
||||
pathJoin(getNodeModulesBinDirPath(), "..")
|
||||
);
|
||||
|
||||
if (configFilePath === null) {
|
||||
return "";
|
||||
}
|
||||
|
||||
const data = await fsPr.readFile(configFilePath);
|
||||
|
||||
return crypto.createHash("sha256").update(data).digest("hex");
|
||||
})();
|
||||
|
||||
const prettierAndConfig: PrettierAndConfigHash = {
|
||||
prettier,
|
||||
configHash
|
||||
};
|
||||
|
||||
getPrettier.cache = prettierAndConfig;
|
||||
|
||||
return prettierAndConfig;
|
||||
}
|
||||
|
||||
export async function runPrettier(params: {
|
||||
sourceCode: string;
|
||||
filePath: string;
|
||||
}): Promise<string> {
|
||||
const { sourceCode, filePath } = params;
|
||||
|
||||
let formattedSourceCode: string;
|
||||
|
||||
try {
|
||||
const { prettier } = await getPrettier();
|
||||
|
||||
const { ignored, inferredParser } = await prettier.getFileInfo(filePath, {
|
||||
resolveConfig: true
|
||||
});
|
||||
|
||||
if (ignored) {
|
||||
return sourceCode;
|
||||
}
|
||||
|
||||
const config = await prettier.resolveConfig(filePath);
|
||||
|
||||
formattedSourceCode = await prettier.format(sourceCode, {
|
||||
...config,
|
||||
filePath,
|
||||
parser: inferredParser ?? undefined
|
||||
});
|
||||
} catch (error) {
|
||||
console.log(
|
||||
chalk.red(
|
||||
`You probably need to upgrade the version of prettier in your project`
|
||||
)
|
||||
);
|
||||
|
||||
throw error;
|
||||
}
|
||||
|
||||
return formattedSourceCode;
|
||||
}
|
||||
@ -1,24 +0,0 @@
|
||||
import * as child_process from "child_process";
|
||||
import { dirname as pathDirname, basename as pathBasename } from "path";
|
||||
import { Deferred } from "evt/tools/Deferred";
|
||||
|
||||
export async function untrackFromGit(params: { filePath: string }): Promise<void> {
|
||||
const { filePath } = params;
|
||||
|
||||
const dDone = new Deferred<void>();
|
||||
|
||||
child_process.exec(
|
||||
`git rm --cached ${pathBasename(filePath)}`,
|
||||
{ cwd: pathDirname(filePath) },
|
||||
error => {
|
||||
if (error !== null) {
|
||||
dDone.reject(error);
|
||||
return;
|
||||
}
|
||||
|
||||
dDone.resolve();
|
||||
}
|
||||
);
|
||||
|
||||
await dDone.pr;
|
||||
}
|
||||
@ -1,146 +1,13 @@
|
||||
import type { BuildContext } from "./shared/buildContext";
|
||||
import * as fs from "fs/promises";
|
||||
import { join as pathJoin } from "path";
|
||||
import { existsAsync } from "./tools/fs.existsAsync";
|
||||
import { maybeDelegateCommandToCustomHandler } from "./shared/customHandler_delegate";
|
||||
import * as crypto from "crypto";
|
||||
import { getIsPrettierAvailable, runPrettier } from "./tools/runPrettier";
|
||||
import type { CliCommandOptions } from "./main";
|
||||
import { getBuildContext } from "./shared/buildContext";
|
||||
import { generateKcGenTs } from "./shared/generateKcGenTs";
|
||||
|
||||
export async function command(params: { buildContext: BuildContext }) {
|
||||
const { buildContext } = params;
|
||||
export async function command(params: { cliCommandOptions: CliCommandOptions }) {
|
||||
const { cliCommandOptions } = params;
|
||||
|
||||
const { hasBeenHandled } = maybeDelegateCommandToCustomHandler({
|
||||
commandName: "update-kc-gen",
|
||||
buildContext
|
||||
const buildContext = getBuildContext({
|
||||
cliCommandOptions
|
||||
});
|
||||
|
||||
if (hasBeenHandled) {
|
||||
return;
|
||||
}
|
||||
|
||||
const filePath = pathJoin(buildContext.themeSrcDirPath, "kc.gen.tsx");
|
||||
|
||||
const hasLoginTheme = buildContext.implementedThemeTypes.login.isImplemented;
|
||||
const hasAccountTheme = buildContext.implementedThemeTypes.account.isImplemented;
|
||||
const hasAdminTheme = buildContext.implementedThemeTypes.admin.isImplemented;
|
||||
|
||||
let newContent = [
|
||||
``,
|
||||
`/* eslint-disable */`,
|
||||
``,
|
||||
`// @ts-nocheck`,
|
||||
``,
|
||||
`// noinspection JSUnusedGlobalSymbols`,
|
||||
``,
|
||||
`import { lazy, Suspense, type ReactNode } from "react";`,
|
||||
``,
|
||||
`export type ThemeName = ${buildContext.themeNames.map(themeName => `"${themeName}"`).join(" | ")};`,
|
||||
``,
|
||||
`export const themeNames: ThemeName[] = [${buildContext.themeNames.map(themeName => `"${themeName}"`).join(", ")}];`,
|
||||
``,
|
||||
`export type KcEnvName = ${buildContext.environmentVariables.length === 0 ? "never" : buildContext.environmentVariables.map(({ name }) => `"${name}"`).join(" | ")};`,
|
||||
``,
|
||||
`export const kcEnvNames: KcEnvName[] = [${buildContext.environmentVariables.map(({ name }) => `"${name}"`).join(", ")}];`,
|
||||
``,
|
||||
`export const kcEnvDefaults: Record<KcEnvName, string> = ${JSON.stringify(
|
||||
Object.fromEntries(
|
||||
buildContext.environmentVariables.map(
|
||||
({ name, default: defaultValue }) => [name, defaultValue]
|
||||
)
|
||||
),
|
||||
null,
|
||||
2
|
||||
)};`,
|
||||
``,
|
||||
`type KcContext =`,
|
||||
hasLoginTheme && ` | import("./login/KcContext").KcContext`,
|
||||
hasAccountTheme && ` | import("./account/KcContext").KcContext`,
|
||||
hasAdminTheme && ` | import("./admin/KcContext").KcContext`,
|
||||
` ;`,
|
||||
``,
|
||||
`declare global {`,
|
||||
` interface Window {`,
|
||||
` kcContext?: KcContext;`,
|
||||
` }`,
|
||||
`}`,
|
||||
``,
|
||||
hasLoginTheme &&
|
||||
`export const KcLoginPage = lazy(() => import("./login/KcPage"));`,
|
||||
hasAccountTheme &&
|
||||
`export const KcAccountPage = lazy(() => import("./account/KcPage"));`,
|
||||
hasAdminTheme &&
|
||||
`export const KcAdminPage = lazy(() => import("./admin/KcPage"));`,
|
||||
``,
|
||||
`export function KcPage(`,
|
||||
` props: {`,
|
||||
` kcContext: KcContext;`,
|
||||
` fallback?: ReactNode;`,
|
||||
` }`,
|
||||
`) {`,
|
||||
` const { kcContext, fallback } = props;`,
|
||||
` return (`,
|
||||
` <Suspense fallback={fallback}>`,
|
||||
` {(() => {`,
|
||||
` switch (kcContext.themeType) {`,
|
||||
hasLoginTheme &&
|
||||
` case "login": return <KcLoginPage kcContext={kcContext} />;`,
|
||||
hasAccountTheme &&
|
||||
` case "account": return <KcAccountPage kcContext={kcContext} />;`,
|
||||
hasAdminTheme &&
|
||||
` case "admin": return <KcAdminPage kcContext={kcContext} />;`,
|
||||
` }`,
|
||||
` })()}`,
|
||||
` </Suspense>`,
|
||||
` );`,
|
||||
`}`,
|
||||
``
|
||||
]
|
||||
.filter(item => typeof item === "string")
|
||||
.join("\n");
|
||||
|
||||
const hash = crypto.createHash("sha256").update(newContent).digest("hex");
|
||||
|
||||
skip_if_no_changes: {
|
||||
if (!(await existsAsync(filePath))) {
|
||||
break skip_if_no_changes;
|
||||
}
|
||||
|
||||
const currentContent = (await fs.readFile(filePath)).toString("utf8");
|
||||
|
||||
if (!currentContent.includes(hash)) {
|
||||
break skip_if_no_changes;
|
||||
}
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
newContent = [
|
||||
`// This file is auto-generated by the \`update-kc-gen\` command. Do not edit it manually.`,
|
||||
`// Hash: ${hash}`,
|
||||
``,
|
||||
newContent
|
||||
].join("\n");
|
||||
|
||||
format: {
|
||||
if (!(await getIsPrettierAvailable())) {
|
||||
break format;
|
||||
}
|
||||
|
||||
newContent = await runPrettier({
|
||||
filePath,
|
||||
sourceCode: newContent
|
||||
});
|
||||
}
|
||||
|
||||
await fs.writeFile(filePath, Buffer.from(newContent, "utf8"));
|
||||
|
||||
delete_legacy_file: {
|
||||
const legacyFilePath = filePath.replace(/tsx$/, "ts");
|
||||
|
||||
if (!(await existsAsync(legacyFilePath))) {
|
||||
break delete_legacy_file;
|
||||
}
|
||||
|
||||
await fs.unlink(legacyFilePath);
|
||||
}
|
||||
await generateKcGenTs({ buildContext });
|
||||
}
|
||||
|
||||
@ -1,7 +1,8 @@
|
||||
import type { Param0 } from "tsafe";
|
||||
import { type CxArg, clsx_withTransform } from "../tools/clsx_withTransform";
|
||||
import { clsx } from "../tools/clsx";
|
||||
import { assert, is } from "tsafe/assert";
|
||||
import { assert } from "tsafe/assert";
|
||||
import { is } from "tsafe/is";
|
||||
|
||||
export function createGetKcClsx<ClassKey extends string>(params: {
|
||||
defaultClasses: Record<ClassKey, string | undefined>;
|
||||
|
||||
@ -1,252 +0,0 @@
|
||||
import { DOMPurify } from "keycloakify/tools/vendor/dompurify";
|
||||
|
||||
type TagType = {
|
||||
name: string;
|
||||
attributes: AttributeType[];
|
||||
};
|
||||
type AttributeType = {
|
||||
name: string;
|
||||
matchRegex?: RegExp;
|
||||
matchFunction?: (value: string) => boolean;
|
||||
};
|
||||
|
||||
// implementation for org.owasp.html.HtmlPolicyBuilder
|
||||
// https://www.javadoc.io/static/com.googlecode.owasp-java-html-sanitizer/owasp-java-html-sanitizer/20160628.1/index.html?org/owasp/html/HtmlPolicyBuilder.html
|
||||
// It supports the methods that KCSanitizerPolicy needs and nothing more
|
||||
|
||||
export class HtmlPolicyBuilder {
|
||||
private globalAttributesAllowed: Set<AttributeType> = new Set();
|
||||
private tagsAllowed: Map<string, TagType> = new Map();
|
||||
private tagsAllowedWithNoAttribute: Set<string> = new Set();
|
||||
private currentAttribute: AttributeType | null = null;
|
||||
private isStylingAllowed: boolean = false;
|
||||
private allowedProtocols: Set<string> = new Set();
|
||||
private enforceRelNofollow: boolean = false;
|
||||
private DOMPurify: typeof DOMPurify;
|
||||
|
||||
// add a constructor
|
||||
constructor(
|
||||
dependencyInjections: Partial<{
|
||||
DOMPurify: typeof DOMPurify;
|
||||
}>
|
||||
) {
|
||||
this.DOMPurify = dependencyInjections.DOMPurify ?? DOMPurify;
|
||||
}
|
||||
|
||||
allowWithoutAttributes(tag: string): this {
|
||||
this.tagsAllowedWithNoAttribute.add(tag);
|
||||
return this;
|
||||
}
|
||||
|
||||
// Adds the attributes for validation
|
||||
allowAttributes(...args: string[]): this {
|
||||
if (args.length) {
|
||||
const attr = args[0];
|
||||
this.currentAttribute = { name: attr }; // Default regex, will be set later
|
||||
}
|
||||
return this;
|
||||
}
|
||||
|
||||
// Matching regex for value of allowed attributes
|
||||
matching(matchingPattern: RegExp | ((value: string) => boolean)): this {
|
||||
if (this.currentAttribute) {
|
||||
if (matchingPattern instanceof RegExp) {
|
||||
this.currentAttribute.matchRegex = matchingPattern;
|
||||
} else {
|
||||
this.currentAttribute.matchFunction = matchingPattern;
|
||||
}
|
||||
}
|
||||
return this;
|
||||
}
|
||||
|
||||
// Make attributes in prev call global
|
||||
globally(): this {
|
||||
if (this.currentAttribute) {
|
||||
this.currentAttribute.matchRegex = /.*/;
|
||||
this.globalAttributesAllowed.add(this.currentAttribute);
|
||||
this.currentAttribute = null; // Reset after global application
|
||||
}
|
||||
return this;
|
||||
}
|
||||
|
||||
// Allow styling globally
|
||||
allowStyling(): this {
|
||||
this.isStylingAllowed = true;
|
||||
return this;
|
||||
}
|
||||
|
||||
// Save attributes for specific tag
|
||||
onElements(...tags: string[]): this {
|
||||
if (this.currentAttribute) {
|
||||
tags.forEach(tag => {
|
||||
const element = this.tagsAllowed.get(tag) || {
|
||||
name: tag,
|
||||
attributes: []
|
||||
};
|
||||
element.attributes.push(this.currentAttribute!);
|
||||
this.tagsAllowed.set(tag, element);
|
||||
});
|
||||
this.currentAttribute = null; // Reset after applying to elements
|
||||
}
|
||||
return this;
|
||||
}
|
||||
|
||||
// Make specific tag allowed
|
||||
allowElements(...tags: string[]): this {
|
||||
tags.forEach(tag => {
|
||||
if (!this.tagsAllowed.has(tag)) {
|
||||
this.tagsAllowed.set(tag, { name: tag, attributes: [] });
|
||||
}
|
||||
});
|
||||
return this;
|
||||
}
|
||||
|
||||
// Handle rel=nofollow on links
|
||||
requireRelNofollowOnLinks(): this {
|
||||
this.enforceRelNofollow = true;
|
||||
return this;
|
||||
}
|
||||
|
||||
// Allow standard URL protocols (could include further implementation)
|
||||
allowStandardUrlProtocols(): this {
|
||||
this.allowedProtocols.add("http");
|
||||
this.allowedProtocols.add("https");
|
||||
this.allowedProtocols.add("mailto");
|
||||
return this;
|
||||
}
|
||||
|
||||
apply(html: string): string {
|
||||
//Clear all previous configs first ( in case we used DOMPurify somewhere else )
|
||||
this.DOMPurify.clearConfig();
|
||||
this.DOMPurify.removeAllHooks();
|
||||
this.setupHooks();
|
||||
return this.DOMPurify.sanitize(html, {
|
||||
ALLOWED_TAGS: Array.from(this.tagsAllowed.keys()),
|
||||
ALLOWED_ATTR: this.getAllowedAttributes(),
|
||||
ALLOWED_URI_REGEXP: this.getAllowedUriRegexp(),
|
||||
ADD_TAGS: this.isStylingAllowed ? ["style"] : [],
|
||||
ADD_ATTR: this.isStylingAllowed ? ["style"] : []
|
||||
});
|
||||
}
|
||||
|
||||
private setupHooks(): void {
|
||||
// Check allowed attribute and global attributes and it doesnt exist in them remove it
|
||||
this.DOMPurify.addHook("uponSanitizeAttribute", (currentNode, hookEvent) => {
|
||||
if (!hookEvent) return;
|
||||
|
||||
const tagName = currentNode.tagName.toLowerCase();
|
||||
const allowedAttributes = this.tagsAllowed.get(tagName)?.attributes || [];
|
||||
|
||||
//Add global attributes to allowed attributes
|
||||
this.globalAttributesAllowed.forEach(attribute => {
|
||||
allowedAttributes.push(attribute);
|
||||
});
|
||||
|
||||
//Add style attribute to allowed attributes
|
||||
if (this.isStylingAllowed) {
|
||||
let styleAttribute: AttributeType = { name: "style", matchRegex: /.*/ };
|
||||
allowedAttributes.push(styleAttribute);
|
||||
}
|
||||
|
||||
// Check if the attribute is allowed
|
||||
if (!allowedAttributes.some(attr => attr.name === hookEvent.attrName)) {
|
||||
hookEvent.forceKeepAttr = false;
|
||||
hookEvent.keepAttr = false;
|
||||
currentNode.removeAttribute(hookEvent.attrName);
|
||||
return;
|
||||
} else {
|
||||
const attributeType = allowedAttributes.find(
|
||||
attr => attr.name === hookEvent.attrName
|
||||
);
|
||||
if (attributeType) {
|
||||
//Check if attribute value is allowed
|
||||
if (
|
||||
attributeType.matchRegex &&
|
||||
!attributeType.matchRegex.test(hookEvent.attrValue)
|
||||
) {
|
||||
hookEvent.forceKeepAttr = false;
|
||||
hookEvent.keepAttr = false;
|
||||
currentNode.removeAttribute(hookEvent.attrName);
|
||||
return;
|
||||
}
|
||||
if (
|
||||
attributeType.matchFunction &&
|
||||
!attributeType.matchFunction(hookEvent.attrValue)
|
||||
) {
|
||||
hookEvent.forceKeepAttr = false;
|
||||
hookEvent.keepAttr = false;
|
||||
currentNode.removeAttribute(hookEvent.attrName);
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
// both attribute and value already checked so they should be ok
|
||||
// set forceKeep to true to make sure next hooks won't delete them
|
||||
// except for href that we will check later
|
||||
if (hookEvent.attrName !== "href") {
|
||||
hookEvent.keepAttr = true;
|
||||
hookEvent.forceKeepAttr = true;
|
||||
}
|
||||
});
|
||||
|
||||
this.DOMPurify.addHook("afterSanitizeAttributes", currentNode => {
|
||||
// if tag is not allowed to have no attribute then remove it completely
|
||||
if (
|
||||
currentNode.attributes.length == 0 &&
|
||||
currentNode.childNodes.length == 0
|
||||
) {
|
||||
if (!this.tagsAllowedWithNoAttribute.has(currentNode.tagName)) {
|
||||
currentNode.remove();
|
||||
}
|
||||
} else {
|
||||
//in case of <a> or <img> if we have no attribute we need to remove them even if they have child
|
||||
if (currentNode.tagName === "A" || currentNode.tagName === "IMG") {
|
||||
if (currentNode.attributes.length == 0) {
|
||||
//add currentNode children to parent node
|
||||
while (currentNode.firstChild) {
|
||||
currentNode?.parentNode?.insertBefore(
|
||||
currentNode.firstChild,
|
||||
currentNode
|
||||
);
|
||||
}
|
||||
// Remove the currentNode itself
|
||||
currentNode.remove();
|
||||
}
|
||||
}
|
||||
//
|
||||
if (currentNode.tagName === "A") {
|
||||
if (this.enforceRelNofollow) {
|
||||
if (!currentNode.hasAttribute("rel")) {
|
||||
currentNode.setAttribute("rel", "nofollow");
|
||||
} else if (
|
||||
!currentNode.getAttribute("rel")?.includes("nofollow")
|
||||
) {
|
||||
currentNode.setAttribute(
|
||||
"rel",
|
||||
currentNode.getAttribute("rel") + " nofollow"
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
private getAllowedAttributes(): string[] {
|
||||
const allowedAttributes: Set<string> = new Set();
|
||||
this.tagsAllowed.forEach(element => {
|
||||
element.attributes.forEach(attribute => {
|
||||
allowedAttributes.add(attribute.name);
|
||||
});
|
||||
});
|
||||
this.globalAttributesAllowed.forEach(attribute => {
|
||||
allowedAttributes.add(attribute.name);
|
||||
});
|
||||
return Array.from(allowedAttributes);
|
||||
}
|
||||
|
||||
private getAllowedUriRegexp(): RegExp {
|
||||
const protocols = Array.from(this.allowedProtocols).join("|");
|
||||
return new RegExp(`^(?:${protocols})://`, "i");
|
||||
}
|
||||
}
|
||||
@ -1,60 +0,0 @@
|
||||
import { KcSanitizerPolicy } from "./KcSanitizerPolicy";
|
||||
import type { DOMPurify as ofTypeDomPurify } from "keycloakify/tools/vendor/dompurify";
|
||||
|
||||
// implementation of keycloak java sanitize method ( KeycloakSanitizerMethod )
|
||||
// https://github.com/keycloak/keycloak/blob/8ce8a4ba089eef25a0e01f58e09890399477b9ef/services/src/main/java/org/keycloak/theme/KeycloakSanitizerMethod.java#L33
|
||||
export class KcSanitizer {
|
||||
private static HREF_PATTERN = /\s+href="([^"]*)"/g;
|
||||
private static textarea: HTMLTextAreaElement | null = null;
|
||||
|
||||
public static sanitize(
|
||||
html: string,
|
||||
dependencyInjections: Partial<{
|
||||
DOMPurify: typeof ofTypeDomPurify;
|
||||
htmlEntitiesDecode: (html: string) => string;
|
||||
}>
|
||||
): string {
|
||||
if (html === "") return "";
|
||||
|
||||
html =
|
||||
dependencyInjections?.htmlEntitiesDecode !== undefined
|
||||
? dependencyInjections.htmlEntitiesDecode(html)
|
||||
: this.decodeHtml(html);
|
||||
const sanitized = KcSanitizerPolicy.sanitize(html, dependencyInjections);
|
||||
return this.fixURLs(sanitized);
|
||||
}
|
||||
|
||||
private static decodeHtml(html: string): string {
|
||||
if (!KcSanitizer.textarea) {
|
||||
KcSanitizer.textarea = document.createElement("textarea");
|
||||
}
|
||||
KcSanitizer.textarea.innerHTML = html;
|
||||
return KcSanitizer.textarea.value;
|
||||
}
|
||||
|
||||
// This will remove unwanted characters from url
|
||||
private static fixURLs(msg: string): string {
|
||||
const HREF_PATTERN = this.HREF_PATTERN;
|
||||
const result = [];
|
||||
let last = 0;
|
||||
let match: RegExpExecArray | null;
|
||||
|
||||
do {
|
||||
match = HREF_PATTERN.exec(msg);
|
||||
if (match) {
|
||||
const href = match[0]
|
||||
.replace(/=/g, "=")
|
||||
.replace(/\.\./g, ".")
|
||||
.replace(/&/g, "&");
|
||||
|
||||
result.push(msg.substring(last, match.index!));
|
||||
result.push(href);
|
||||
|
||||
last = HREF_PATTERN.lastIndex;
|
||||
}
|
||||
} while (match);
|
||||
|
||||
result.push(msg.substring(last));
|
||||
return result.join("");
|
||||
}
|
||||
}
|
||||
@ -1,294 +0,0 @@
|
||||
import { HtmlPolicyBuilder } from "./HtmlPolicyBuilder";
|
||||
import type { DOMPurify as ofTypeDomPurify } from "keycloakify/tools/vendor/dompurify";
|
||||
|
||||
//implementation of java Sanitizer policy ( KeycloakSanitizerPolicy )
|
||||
// All regex directly copied from the keycloak source but some of them changed slightly to work with typescript(ONSITE_URL and OFFSITE_URL)
|
||||
// Also replaced ?i with "i" tag as second parameter of RegExp
|
||||
//https://github.com/keycloak/keycloak/blob/8ce8a4ba089eef25a0e01f58e09890399477b9ef/services/src/main/java/org/keycloak/theme/KeycloakSanitizerPolicy.java#L29
|
||||
export class KcSanitizerPolicy {
|
||||
public static readonly COLOR_NAME = new RegExp(
|
||||
"(?:aqua|black|blue|fuchsia|gray|grey|green|lime|maroon|navy|olive|purple|red|silver|teal|white|yellow)"
|
||||
);
|
||||
|
||||
public static readonly COLOR_CODE = new RegExp(
|
||||
"(?:#(?:[0-9a-fA-F]{3}(?:[0-9a-fA-F]{3})?))"
|
||||
);
|
||||
|
||||
public static readonly NUMBER_OR_PERCENT = new RegExp("[0-9]+%?");
|
||||
|
||||
public static readonly PARAGRAPH = new RegExp(
|
||||
"(?:[\\p{L}\\p{N},'\\.\\s\\-_\\(\\)]|&[0-9]{2};)*",
|
||||
"u" // Unicode flag for \p{L} and \p{N} in the pattern
|
||||
);
|
||||
|
||||
public static readonly HTML_ID = new RegExp("[a-zA-Z0-9\\:\\-_\\.]+");
|
||||
|
||||
public static readonly HTML_TITLE = new RegExp(
|
||||
"[\\p{L}\\p{N}\\s\\-_',:\\[\\]!\\./\\\\\\(\\)&]*",
|
||||
"u" // Unicode flag for \p{L} and \p{N} in the pattern
|
||||
);
|
||||
|
||||
public static readonly HTML_CLASS = new RegExp("[a-zA-Z0-9\\s,\\-_]+");
|
||||
|
||||
public static readonly ONSITE_URL = new RegExp(
|
||||
"(?:[\\p{L}\\p{N}.#@\\$%+&;\\-_~,?=/!]+|#(\\w)+)",
|
||||
"u" // Unicode flag for \p{L} and \p{N} in the pattern
|
||||
);
|
||||
|
||||
public static readonly OFFSITE_URL = new RegExp(
|
||||
"\\s*(?:(?:ht|f)tps?://|mailto:)[\\p{L}\\p{N}]+" +
|
||||
"[\\p{L}\\p{N}\\p{Zs}.#@\\$%+&;:\\-_~,?=/!()]*\\s*",
|
||||
"u" // Unicode flag for \p{L} and \p{N} in the pattern
|
||||
);
|
||||
|
||||
public static readonly NUMBER = new RegExp(
|
||||
"[+-]?(?:(?:[0-9]+(?:\\.[0-9]*)?)|\\.[0-9]+)"
|
||||
);
|
||||
public static readonly NAME = new RegExp("[a-zA-Z0-9\\-_\\$]+");
|
||||
|
||||
public static readonly ALIGN = new RegExp(
|
||||
"\\b(center|left|right|justify|char)\\b",
|
||||
"i" // Case-insensitive flag
|
||||
);
|
||||
|
||||
public static readonly VALIGN = new RegExp(
|
||||
"\\b(baseline|bottom|middle|top)\\b",
|
||||
"i" // Case-insensitive flag
|
||||
);
|
||||
|
||||
public static readonly HISTORY_BACK = new RegExp(
|
||||
"(?:javascript:)?\\Qhistory.go(-1)\\E"
|
||||
);
|
||||
|
||||
public static readonly ONE_CHAR = new RegExp(
|
||||
".?",
|
||||
"s" // Dotall flag for . to match newlines
|
||||
);
|
||||
|
||||
private static COLOR_NAME_OR_COLOR_CODE(s: string): boolean {
|
||||
return (
|
||||
KcSanitizerPolicy.COLOR_NAME.test(s) || KcSanitizerPolicy.COLOR_CODE.test(s)
|
||||
);
|
||||
}
|
||||
|
||||
private static ONSITE_OR_OFFSITE_URL(s: string): boolean {
|
||||
return (
|
||||
KcSanitizerPolicy.ONSITE_URL.test(s) || KcSanitizerPolicy.OFFSITE_URL.test(s)
|
||||
);
|
||||
}
|
||||
|
||||
public static sanitize(
|
||||
html: string,
|
||||
dependencyInjections: Partial<{
|
||||
DOMPurify: typeof ofTypeDomPurify;
|
||||
}>
|
||||
): string {
|
||||
return new HtmlPolicyBuilder(dependencyInjections)
|
||||
.allowWithoutAttributes("span")
|
||||
|
||||
.allowAttributes("id")
|
||||
.matching(this.HTML_ID)
|
||||
.globally()
|
||||
|
||||
.allowAttributes("class")
|
||||
.matching(this.HTML_CLASS)
|
||||
.globally()
|
||||
|
||||
.allowAttributes("lang")
|
||||
.matching(/[a-zA-Z]{2,20}/)
|
||||
.globally()
|
||||
|
||||
.allowAttributes("title")
|
||||
.matching(this.HTML_TITLE)
|
||||
.globally()
|
||||
|
||||
.allowStyling()
|
||||
|
||||
.allowAttributes("align")
|
||||
.matching(this.ALIGN)
|
||||
.onElements("p")
|
||||
|
||||
.allowAttributes("for")
|
||||
.matching(this.HTML_ID)
|
||||
.onElements("label")
|
||||
|
||||
.allowAttributes("color")
|
||||
.matching(this.COLOR_NAME_OR_COLOR_CODE)
|
||||
.onElements("font")
|
||||
|
||||
.allowAttributes("face")
|
||||
.matching(/[\w;, \-]+/)
|
||||
.onElements("font")
|
||||
|
||||
.allowAttributes("size")
|
||||
.matching(this.NUMBER)
|
||||
.onElements("font")
|
||||
|
||||
.allowAttributes("href")
|
||||
.matching(this.ONSITE_OR_OFFSITE_URL)
|
||||
.onElements("a")
|
||||
|
||||
.allowStandardUrlProtocols()
|
||||
.allowAttributes("nohref")
|
||||
.onElements("a")
|
||||
|
||||
.allowAttributes("name")
|
||||
.matching(this.NAME)
|
||||
.onElements("a")
|
||||
|
||||
.allowAttributes("onfocus", "onblur", "onclick", "onmousedown", "onmouseup")
|
||||
.matching(this.HISTORY_BACK)
|
||||
.onElements("a")
|
||||
|
||||
.requireRelNofollowOnLinks()
|
||||
.allowAttributes("src")
|
||||
.matching(this.ONSITE_OR_OFFSITE_URL)
|
||||
.onElements("img")
|
||||
|
||||
.allowAttributes("name")
|
||||
.matching(this.NAME)
|
||||
.onElements("img")
|
||||
|
||||
.allowAttributes("alt")
|
||||
.matching(this.PARAGRAPH)
|
||||
.onElements("img")
|
||||
|
||||
.allowAttributes("border", "hspace", "vspace")
|
||||
.matching(this.NUMBER)
|
||||
.onElements("img")
|
||||
|
||||
.allowAttributes("border", "cellpadding", "cellspacing")
|
||||
.matching(this.NUMBER)
|
||||
.onElements("table")
|
||||
|
||||
.allowAttributes("bgcolor")
|
||||
.matching(this.COLOR_NAME_OR_COLOR_CODE)
|
||||
.onElements("table")
|
||||
|
||||
.allowAttributes("background")
|
||||
.matching(this.ONSITE_URL)
|
||||
.onElements("table")
|
||||
|
||||
.allowAttributes("align")
|
||||
.matching(this.ALIGN)
|
||||
.onElements("table")
|
||||
|
||||
.allowAttributes("noresize")
|
||||
.matching(new RegExp("noresize", "i"))
|
||||
.onElements("table")
|
||||
|
||||
.allowAttributes("background")
|
||||
.matching(this.ONSITE_URL)
|
||||
.onElements("td", "th", "tr")
|
||||
|
||||
.allowAttributes("bgcolor")
|
||||
.matching(this.COLOR_NAME_OR_COLOR_CODE)
|
||||
.onElements("td", "th")
|
||||
|
||||
.allowAttributes("abbr")
|
||||
.matching(this.PARAGRAPH)
|
||||
.onElements("td", "th")
|
||||
|
||||
.allowAttributes("axis", "headers")
|
||||
.matching(this.NAME)
|
||||
.onElements("td", "th")
|
||||
|
||||
.allowAttributes("scope")
|
||||
.matching(new RegExp("(?:row|col)(?:group)?", "i"))
|
||||
.onElements("td", "th")
|
||||
|
||||
.allowAttributes("nowrap")
|
||||
.onElements("td", "th")
|
||||
|
||||
.allowAttributes("height", "width")
|
||||
.matching(this.NUMBER_OR_PERCENT)
|
||||
.onElements("table", "td", "th", "tr", "img")
|
||||
|
||||
.allowAttributes("align")
|
||||
.matching(this.ALIGN)
|
||||
.onElements(
|
||||
"thead",
|
||||
"tbody",
|
||||
"tfoot",
|
||||
"img",
|
||||
"td",
|
||||
"th",
|
||||
"tr",
|
||||
"colgroup",
|
||||
"col"
|
||||
)
|
||||
|
||||
.allowAttributes("valign")
|
||||
.matching(this.VALIGN)
|
||||
.onElements("thead", "tbody", "tfoot", "td", "th", "tr", "colgroup", "col")
|
||||
|
||||
.allowAttributes("charoff")
|
||||
.matching(this.NUMBER_OR_PERCENT)
|
||||
.onElements("td", "th", "tr", "colgroup", "col", "thead", "tbody", "tfoot")
|
||||
|
||||
.allowAttributes("char")
|
||||
.matching(this.ONE_CHAR)
|
||||
.onElements("td", "th", "tr", "colgroup", "col", "thead", "tbody", "tfoot")
|
||||
|
||||
.allowAttributes("colspan", "rowspan")
|
||||
.matching(this.NUMBER)
|
||||
.onElements("td", "th")
|
||||
|
||||
.allowAttributes("span", "width")
|
||||
.matching(this.NUMBER_OR_PERCENT)
|
||||
.onElements("colgroup", "col")
|
||||
.allowElements(
|
||||
"a",
|
||||
"label",
|
||||
"noscript",
|
||||
"h1",
|
||||
"h2",
|
||||
"h3",
|
||||
"h4",
|
||||
"h5",
|
||||
"h6",
|
||||
"p",
|
||||
"i",
|
||||
"b",
|
||||
"u",
|
||||
"strong",
|
||||
"em",
|
||||
"small",
|
||||
"big",
|
||||
"pre",
|
||||
"code",
|
||||
"cite",
|
||||
"samp",
|
||||
"sub",
|
||||
"sup",
|
||||
"strike",
|
||||
"center",
|
||||
"blockquote",
|
||||
"hr",
|
||||
"br",
|
||||
"col",
|
||||
"font",
|
||||
"map",
|
||||
"span",
|
||||
"div",
|
||||
"img",
|
||||
"ul",
|
||||
"ol",
|
||||
"li",
|
||||
"dd",
|
||||
"dt",
|
||||
"dl",
|
||||
"tbody",
|
||||
"thead",
|
||||
"tfoot",
|
||||
"table",
|
||||
"td",
|
||||
"th",
|
||||
"tr",
|
||||
"colgroup",
|
||||
"fieldset",
|
||||
"legend"
|
||||
)
|
||||
.apply(html);
|
||||
}
|
||||
}
|
||||
@ -1,5 +0,0 @@
|
||||
import { KcSanitizer } from "./KcSanitizer";
|
||||
|
||||
export function kcSanitize(html: string): string {
|
||||
return KcSanitizer.sanitize(html, {});
|
||||
}
|
||||
@ -2,7 +2,7 @@ import type { ThemeType, LoginThemePageId } from "keycloakify/bin/shared/constan
|
||||
import type { ValueOf } from "keycloakify/tools/ValueOf";
|
||||
import { assert } from "tsafe/assert";
|
||||
import type { Equals } from "tsafe";
|
||||
import type { ClassKey } from "keycloakify/login/lib/kcClsx";
|
||||
import type { ClassKey } from "keycloakify/login/TemplateProps";
|
||||
|
||||
export type ExtendKcContext<
|
||||
KcContextExtension extends { properties?: Record<string, string | undefined> },
|
||||
@ -94,7 +94,6 @@ export declare namespace KcContext {
|
||||
languageTag: string;
|
||||
}[];
|
||||
currentLanguageTag: string;
|
||||
rtl?: boolean;
|
||||
};
|
||||
auth?: {
|
||||
showUsername?: boolean;
|
||||
@ -102,7 +101,7 @@ export declare namespace KcContext {
|
||||
showTryAnotherWayLink?: boolean;
|
||||
attemptedUsername?: string;
|
||||
};
|
||||
scripts?: string[];
|
||||
scripts: string[];
|
||||
message?: {
|
||||
type: "success" | "warning" | "error" | "info";
|
||||
summary: string;
|
||||
|
||||
@ -7,7 +7,6 @@ import {
|
||||
import { id } from "tsafe/id";
|
||||
import { assert, type Equals } from "tsafe/assert";
|
||||
import { BASE_URL } from "keycloakify/lib/BASE_URL";
|
||||
import type { LanguageTag } from "keycloakify/login/i18n/messages_defaultSet/types";
|
||||
|
||||
const attributesByName = Object.fromEntries(
|
||||
id<Attribute[]>([
|
||||
@ -117,59 +116,35 @@ export const kcContextCommonMock: KcContext.Common = {
|
||||
}
|
||||
},
|
||||
locale: {
|
||||
supported: (
|
||||
[
|
||||
/* spell-checker: disable */
|
||||
["de", "Deutsch"],
|
||||
["no", "Norsk"],
|
||||
["ru", "Русский"],
|
||||
["sv", "Svenska"],
|
||||
["pt-BR", "Português (Brasil)"],
|
||||
["lt", "Lietuvių"],
|
||||
["en", "English"],
|
||||
["it", "Italiano"],
|
||||
["fr", "Français"],
|
||||
["zh-CN", "中文简体"],
|
||||
["es", "Español"],
|
||||
["cs", "Čeština"],
|
||||
["ja", "日本語"],
|
||||
["sk", "Slovenčina"],
|
||||
["pl", "Polski"],
|
||||
["ca", "Català"],
|
||||
["nl", "Nederlands"],
|
||||
["tr", "Türkçe"],
|
||||
["ar", "العربية"],
|
||||
["da", "Dansk"],
|
||||
["el", "Ελληνικά"],
|
||||
["fa", "فارسی"],
|
||||
["fi", "Suomi"],
|
||||
["hu", "Magyar"],
|
||||
["ka", "ქართული"],
|
||||
["lv", "Latviešu"],
|
||||
["pt", "Português"],
|
||||
["th", "ไทย"],
|
||||
["uk", "Українська"],
|
||||
["zh-TW", "中文繁體"]
|
||||
/* spell-checker: enable */
|
||||
] as const
|
||||
).map(([languageTag, label]) => {
|
||||
{
|
||||
type Got = typeof languageTag;
|
||||
type Expected = LanguageTag;
|
||||
|
||||
type Missing = Exclude<Expected, Got>;
|
||||
type Unexpected = Exclude<Got, Expected>;
|
||||
|
||||
assert<Equals<Missing, never>>;
|
||||
assert<Equals<Unexpected, never>>;
|
||||
}
|
||||
|
||||
return {
|
||||
languageTag,
|
||||
label,
|
||||
url: "https://gist.github.com/garronej/52baaca1bb925f2296ab32741e062b8e"
|
||||
} as const;
|
||||
}),
|
||||
supported: [
|
||||
/* spell-checker: disable */
|
||||
["de", "Deutsch"],
|
||||
["no", "Norsk"],
|
||||
["ru", "Русский"],
|
||||
["sv", "Svenska"],
|
||||
["pt-BR", "Português (Brasil)"],
|
||||
["lt", "Lietuvių"],
|
||||
["en", "English"],
|
||||
["it", "Italiano"],
|
||||
["fr", "Français"],
|
||||
["zh-CN", "中文简体"],
|
||||
["es", "Español"],
|
||||
["cs", "Čeština"],
|
||||
["ja", "日本語"],
|
||||
["sk", "Slovenčina"],
|
||||
["pl", "Polski"],
|
||||
["ca", "Català"],
|
||||
["nl", "Nederlands"],
|
||||
["tr", "Türkçe"]
|
||||
/* spell-checker: enable */
|
||||
].map(
|
||||
([languageTag, label]) =>
|
||||
({
|
||||
languageTag,
|
||||
label,
|
||||
url: "https://gist.github.com/garronej/52baaca1bb925f2296ab32741e062b8e"
|
||||
}) as const
|
||||
),
|
||||
|
||||
currentLanguageTag: "en"
|
||||
},
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
import { useEffect } from "react";
|
||||
import { assert } from "keycloakify/tools/assert";
|
||||
import { clsx } from "keycloakify/tools/clsx";
|
||||
import { kcSanitize } from "keycloakify/lib/kcSanitize";
|
||||
import type { TemplateProps } from "keycloakify/login/TemplateProps";
|
||||
import { getKcClsx } from "keycloakify/login/lib/kcClsx";
|
||||
import { useSetClassName } from "keycloakify/tools/useSetClassName";
|
||||
import { useInitialize } from "keycloakify/login/Template.useInitialize";
|
||||
import { useStylesAndScripts } from "keycloakify/login/Template.useStylesAndScripts";
|
||||
import type { I18n } from "./i18n";
|
||||
import type { KcContext } from "./KcContext";
|
||||
|
||||
@ -27,9 +27,9 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
|
||||
|
||||
const { kcClsx } = getKcClsx({ doUseDefaultCss, classes });
|
||||
|
||||
const { msg, msgStr, currentLanguage, enabledLanguages } = i18n;
|
||||
const { msg, msgStr, getChangeLocaleUrl, labelBySupportedLanguageTag, currentLanguageTag } = i18n;
|
||||
|
||||
const { realm, auth, url, message, isAppInitiatedAction } = kcContext;
|
||||
const { realm, locale, auth, url, message, isAppInitiatedAction } = kcContext;
|
||||
|
||||
useEffect(() => {
|
||||
document.title = documentTitle ?? msgStr("loginTitle", kcContext.realm.displayName);
|
||||
@ -45,7 +45,7 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
|
||||
className: bodyClassName ?? kcClsx("kcBodyClass")
|
||||
});
|
||||
|
||||
const { isReadyToRender } = useInitialize({ kcContext, doUseDefaultCss });
|
||||
const { isReadyToRender } = useStylesAndScripts({ kcContext, doUseDefaultCss });
|
||||
|
||||
if (!isReadyToRender) {
|
||||
return null;
|
||||
@ -58,9 +58,10 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
|
||||
{msg("loginTitleHtml", realm.displayNameHtml)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className={kcClsx("kcFormCardClass")}>
|
||||
<header className={kcClsx("kcFormHeaderClass")}>
|
||||
{enabledLanguages.length > 1 && (
|
||||
{realm.internationalizationEnabled && (assert(locale !== undefined), locale.supported.length > 1) && (
|
||||
<div className={kcClsx("kcLocaleMainClass")} id="kc-locale">
|
||||
<div id="kc-locale-wrapper" className={kcClsx("kcLocaleWrapperClass")}>
|
||||
<div id="kc-locale-dropdown" className={clsx("menu-button-links", kcClsx("kcLocaleDropDownClass"))}>
|
||||
@ -72,7 +73,7 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
|
||||
aria-expanded="false"
|
||||
aria-controls="language-switch1"
|
||||
>
|
||||
{currentLanguage.label}
|
||||
{labelBySupportedLanguageTag[currentLanguageTag]}
|
||||
</button>
|
||||
<ul
|
||||
role="menu"
|
||||
@ -82,10 +83,15 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
|
||||
id="language-switch1"
|
||||
className={kcClsx("kcLocaleListClass")}
|
||||
>
|
||||
{enabledLanguages.map(({ languageTag, label, href }, i) => (
|
||||
{locale.supported.map(({ languageTag }, i) => (
|
||||
<li key={languageTag} className={kcClsx("kcLocaleListItemClass")} role="none">
|
||||
<a role="menuitem" id={`language-${i + 1}`} className={kcClsx("kcLocaleItemClass")} href={href}>
|
||||
{label}
|
||||
<a
|
||||
role="menuitem"
|
||||
id={`language-${i + 1}`}
|
||||
className={kcClsx("kcLocaleItemClass")}
|
||||
href={getChangeLocaleUrl(languageTag)}
|
||||
>
|
||||
{labelBySupportedLanguageTag[languageTag]}
|
||||
</a>
|
||||
</li>
|
||||
))}
|
||||
@ -146,7 +152,7 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
|
||||
<span
|
||||
className={kcClsx("kcAlertTitleClass")}
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: kcSanitize(message.summary)
|
||||
__html: message.summary
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@ -2,7 +2,7 @@ import { useEffect } from "react";
|
||||
import { assert } from "keycloakify/tools/assert";
|
||||
import { useInsertScriptTags } from "keycloakify/tools/useInsertScriptTags";
|
||||
import { useInsertLinkTags } from "keycloakify/tools/useInsertLinkTags";
|
||||
import type { KcContext } from "keycloakify/login/KcContext";
|
||||
import { KcContext } from "keycloakify/login/KcContext/KcContext";
|
||||
|
||||
export type KcContextLike = {
|
||||
url: {
|
||||
@ -10,19 +10,34 @@ export type KcContextLike = {
|
||||
resourcesPath: string;
|
||||
ssoLoginInOtherTabsUrl: string;
|
||||
};
|
||||
scripts?: string[];
|
||||
locale?: {
|
||||
currentLanguageTag: string;
|
||||
};
|
||||
scripts: string[];
|
||||
};
|
||||
|
||||
assert<keyof KcContextLike extends keyof KcContext ? true : false>();
|
||||
assert<KcContext extends KcContextLike ? true : false>();
|
||||
|
||||
export function useInitialize(params: {
|
||||
export function useStylesAndScripts(params: {
|
||||
kcContext: KcContextLike;
|
||||
doUseDefaultCss: boolean;
|
||||
}) {
|
||||
const { kcContext, doUseDefaultCss } = params;
|
||||
|
||||
const { url, scripts } = kcContext;
|
||||
const { url, locale, scripts } = kcContext;
|
||||
|
||||
useEffect(() => {
|
||||
const { currentLanguageTag } = locale ?? {};
|
||||
|
||||
if (currentLanguageTag === undefined) {
|
||||
return;
|
||||
}
|
||||
|
||||
const html = document.querySelector("html");
|
||||
assert(html !== null);
|
||||
html.lang = currentLanguageTag;
|
||||
}, []);
|
||||
|
||||
const { areAllStyleSheetsLoaded } = useInsertLinkTags({
|
||||
componentOrHookName: "Template",
|
||||
@ -45,18 +60,18 @@ export function useInitialize(params: {
|
||||
type: "module",
|
||||
src: `${url.resourcesPath}/js/menu-button-links.js`
|
||||
},
|
||||
...(scripts === undefined
|
||||
? []
|
||||
: scripts.map(src => ({
|
||||
type: "text/javascript" as const,
|
||||
src
|
||||
}))),
|
||||
...scripts.map(src => ({
|
||||
type: "text/javascript" as const,
|
||||
src
|
||||
})),
|
||||
{
|
||||
type: "module",
|
||||
textContent: `
|
||||
import { checkCookiesAndSetTimer } from "${url.resourcesPath}/js/authChecker.js";
|
||||
|
||||
checkCookiesAndSetTimer("${url.ssoLoginInOtherTabsUrl}");
|
||||
checkCookiesAndSetTimer(
|
||||
"${url.ssoLoginInOtherTabsUrl}"
|
||||
);
|
||||
`
|
||||
}
|
||||
]
|
||||
@ -1,5 +1,4 @@
|
||||
import type { ReactNode } from "react";
|
||||
import type { ClassKey } from "keycloakify/login/lib/kcClsx";
|
||||
|
||||
export type TemplateProps<KcContext, I18n> = {
|
||||
kcContext: KcContext;
|
||||
@ -19,4 +18,128 @@ export type TemplateProps<KcContext, I18n> = {
|
||||
bodyClassName?: string;
|
||||
};
|
||||
|
||||
export type { ClassKey };
|
||||
export type ClassKey =
|
||||
| "kcBodyClass"
|
||||
| "kcHeaderWrapperClass"
|
||||
| "kcLocaleWrapperClass"
|
||||
| "kcInfoAreaWrapperClass"
|
||||
| "kcFormButtonsWrapperClass"
|
||||
| "kcFormOptionsWrapperClass"
|
||||
| "kcCheckboxInputClass"
|
||||
| "kcLocaleDropDownClass"
|
||||
| "kcLocaleListItemClass"
|
||||
| "kcContentWrapperClass"
|
||||
| "kcLogoIdP-facebook"
|
||||
| "kcAuthenticatorOTPClass"
|
||||
| "kcLogoIdP-bitbucket"
|
||||
| "kcAuthenticatorWebAuthnClass"
|
||||
| "kcWebAuthnDefaultIcon"
|
||||
| "kcLogoIdP-stackoverflow"
|
||||
| "kcSelectAuthListItemClass"
|
||||
| "kcLogoIdP-microsoft"
|
||||
| "kcLoginOTPListItemHeaderClass"
|
||||
| "kcLocaleItemClass"
|
||||
| "kcLoginOTPListItemIconBodyClass"
|
||||
| "kcInputHelperTextAfterClass"
|
||||
| "kcFormClass"
|
||||
| "kcSelectAuthListClass"
|
||||
| "kcInputClassRadioCheckboxLabelDisabled"
|
||||
| "kcSelectAuthListItemIconClass"
|
||||
| "kcRecoveryCodesWarning"
|
||||
| "kcFormSettingClass"
|
||||
| "kcWebAuthnBLE"
|
||||
| "kcInputWrapperClass"
|
||||
| "kcSelectAuthListItemArrowIconClass"
|
||||
| "kcFeedbackAreaClass"
|
||||
| "kcFormPasswordVisibilityButtonClass"
|
||||
| "kcLogoIdP-google"
|
||||
| "kcCheckLabelClass"
|
||||
| "kcSelectAuthListItemFillClass"
|
||||
| "kcAuthenticatorDefaultClass"
|
||||
| "kcLogoIdP-gitlab"
|
||||
| "kcFormAreaClass"
|
||||
| "kcFormButtonsClass"
|
||||
| "kcInputClassRadioLabel"
|
||||
| "kcAuthenticatorWebAuthnPasswordlessClass"
|
||||
| "kcSelectAuthListItemHeadingClass"
|
||||
| "kcInfoAreaClass"
|
||||
| "kcLogoLink"
|
||||
| "kcContainerClass"
|
||||
| "kcSelectAuthListItemTitle"
|
||||
| "kcHtmlClass"
|
||||
| "kcLoginOTPListItemTitleClass"
|
||||
| "kcLogoIdP-openshift-v4"
|
||||
| "kcWebAuthnUnknownIcon"
|
||||
| "kcFormSocialAccountNameClass"
|
||||
| "kcLogoIdP-openshift-v3"
|
||||
| "kcLoginOTPListInputClass"
|
||||
| "kcWebAuthnUSB"
|
||||
| "kcInputClassRadio"
|
||||
| "kcWebAuthnKeyIcon"
|
||||
| "kcFeedbackInfoIcon"
|
||||
| "kcCommonLogoIdP"
|
||||
| "kcRecoveryCodesActions"
|
||||
| "kcFormGroupHeader"
|
||||
| "kcFormSocialAccountSectionClass"
|
||||
| "kcLogoIdP-instagram"
|
||||
| "kcAlertClass"
|
||||
| "kcHeaderClass"
|
||||
| "kcLabelWrapperClass"
|
||||
| "kcFormPasswordVisibilityIconShow"
|
||||
| "kcFormSocialAccountLinkClass"
|
||||
| "kcLocaleMainClass"
|
||||
| "kcInputGroup"
|
||||
| "kcTextareaClass"
|
||||
| "kcButtonBlockClass"
|
||||
| "kcButtonClass"
|
||||
| "kcWebAuthnNFC"
|
||||
| "kcLocaleClass"
|
||||
| "kcInputClassCheckboxInput"
|
||||
| "kcFeedbackErrorIcon"
|
||||
| "kcInputLargeClass"
|
||||
| "kcInputErrorMessageClass"
|
||||
| "kcRecoveryCodesList"
|
||||
| "kcFormSocialAccountListClass"
|
||||
| "kcAlertTitleClass"
|
||||
| "kcAuthenticatorPasswordClass"
|
||||
| "kcCheckInputClass"
|
||||
| "kcLogoIdP-linkedin"
|
||||
| "kcLogoIdP-twitter"
|
||||
| "kcFeedbackWarningIcon"
|
||||
| "kcResetFlowIcon"
|
||||
| "kcSelectAuthListItemIconPropertyClass"
|
||||
| "kcFeedbackSuccessIcon"
|
||||
| "kcLoginOTPListClass"
|
||||
| "kcSrOnlyClass"
|
||||
| "kcFormSocialAccountListGridClass"
|
||||
| "kcButtonDefaultClass"
|
||||
| "kcFormGroupErrorClass"
|
||||
| "kcSelectAuthListItemDescriptionClass"
|
||||
| "kcSelectAuthListItemBodyClass"
|
||||
| "kcWebAuthnInternal"
|
||||
| "kcSelectAuthListItemArrowClass"
|
||||
| "kcCheckClass"
|
||||
| "kcContentClass"
|
||||
| "kcLogoClass"
|
||||
| "kcLoginOTPListItemIconClass"
|
||||
| "kcLoginClass"
|
||||
| "kcSignUpClass"
|
||||
| "kcButtonLargeClass"
|
||||
| "kcFormCardClass"
|
||||
| "kcLocaleListClass"
|
||||
| "kcInputClass"
|
||||
| "kcFormGroupClass"
|
||||
| "kcLogoIdP-paypal"
|
||||
| "kcInputClassCheckbox"
|
||||
| "kcRecoveryCodesConfirmation"
|
||||
| "kcFormPasswordVisibilityIconHide"
|
||||
| "kcInputClassRadioInput"
|
||||
| "kcFormSocialAccountListButtonClass"
|
||||
| "kcInputClassCheckboxLabel"
|
||||
| "kcFormOptionsClass"
|
||||
| "kcFormHeaderClass"
|
||||
| "kcFormSocialAccountGridItem"
|
||||
| "kcButtonPrimaryClass"
|
||||
| "kcInputHelperTextBeforeClass"
|
||||
| "kcLogoIdP-github"
|
||||
| "kcLabelClass";
|
||||
|
||||
@ -434,7 +434,9 @@ function AddRemoveButtonsMultiValuedAttribute(props: {
|
||||
}
|
||||
|
||||
function InputTagSelects(props: InputFieldByTypeProps) {
|
||||
const { attribute, dispatchFormAction, kcClsx, i18n, valueOrValues } = props;
|
||||
const { attribute, dispatchFormAction, kcClsx, valueOrValues } = props;
|
||||
|
||||
const { advancedMsg } = props.i18n;
|
||||
|
||||
const { classDiv, classInput, classLabel, inputType } = (() => {
|
||||
const { inputType } = attribute.annotations;
|
||||
@ -531,7 +533,7 @@ function InputTagSelects(props: InputFieldByTypeProps) {
|
||||
htmlFor={`${attribute.name}-${option}`}
|
||||
className={`${classLabel}${attribute.readOnly ? ` ${kcClsx("kcInputClassRadioCheckboxLabelDisabled")}` : ""}`}
|
||||
>
|
||||
{inputLabel(i18n, attribute, option)}
|
||||
{advancedMsg(option)}
|
||||
</label>
|
||||
</div>
|
||||
))}
|
||||
@ -578,6 +580,8 @@ function TextareaTag(props: InputFieldByTypeProps) {
|
||||
function SelectTag(props: InputFieldByTypeProps) {
|
||||
const { attribute, dispatchFormAction, kcClsx, displayableErrors, i18n, valueOrValues } = props;
|
||||
|
||||
const { advancedMsgStr } = i18n;
|
||||
|
||||
const isMultiple = attribute.annotations.inputType === "multiselect";
|
||||
|
||||
return (
|
||||
@ -641,26 +645,22 @@ function SelectTag(props: InputFieldByTypeProps) {
|
||||
|
||||
return options.map(option => (
|
||||
<option key={option} value={option}>
|
||||
{inputLabel(i18n, attribute, option)}
|
||||
{(() => {
|
||||
if (attribute.annotations.inputOptionLabels !== undefined) {
|
||||
const { inputOptionLabels } = attribute.annotations;
|
||||
|
||||
return advancedMsgStr(inputOptionLabels[option] ?? option);
|
||||
}
|
||||
|
||||
if (attribute.annotations.inputOptionLabelsI18nPrefix !== undefined) {
|
||||
return advancedMsgStr(`${attribute.annotations.inputOptionLabelsI18nPrefix}.${option}`);
|
||||
}
|
||||
|
||||
return option;
|
||||
})()}
|
||||
</option>
|
||||
));
|
||||
})()}
|
||||
</select>
|
||||
);
|
||||
}
|
||||
|
||||
function inputLabel(i18n: I18n, attribute: Attribute, option: string) {
|
||||
const { advancedMsg } = i18n;
|
||||
|
||||
if (attribute.annotations.inputOptionLabels !== undefined) {
|
||||
const { inputOptionLabels } = attribute.annotations;
|
||||
|
||||
return advancedMsg(inputOptionLabels[option] ?? option);
|
||||
}
|
||||
|
||||
if (attribute.annotations.inputOptionLabelsI18nPrefix !== undefined) {
|
||||
return advancedMsg(`${attribute.annotations.inputOptionLabelsI18nPrefix}.${option}`);
|
||||
}
|
||||
|
||||
return option;
|
||||
}
|
||||
|
||||
6
src/login/i18n/GenericI18n.tsx
Normal file
6
src/login/i18n/GenericI18n.tsx
Normal file
@ -0,0 +1,6 @@
|
||||
import type { GenericI18n_noJsx } from "./i18n";
|
||||
|
||||
export type GenericI18n<MessageKey extends string> = GenericI18n_noJsx<MessageKey> & {
|
||||
msg: (key: MessageKey, ...args: (string | undefined)[]) => JSX.Element;
|
||||
advancedMsg: (key: string, ...args: (string | undefined)[]) => JSX.Element;
|
||||
};
|
||||
252
src/login/i18n/i18n.tsx
Normal file
252
src/login/i18n/i18n.tsx
Normal file
@ -0,0 +1,252 @@
|
||||
import "keycloakify/tools/Object.fromEntries";
|
||||
import { assert } from "tsafe/assert";
|
||||
import messages_defaultSet_fallbackLanguage from "./messages_defaultSet/en";
|
||||
import { fetchMessages_defaultSet } from "./messages_defaultSet";
|
||||
import type { KcContext } from "../KcContext";
|
||||
import { FALLBACK_LANGUAGE_TAG } from "keycloakify/bin/shared/constants";
|
||||
import { id } from "tsafe/id";
|
||||
|
||||
export type KcContextLike = {
|
||||
locale?: {
|
||||
currentLanguageTag: string;
|
||||
supported: { languageTag: string; url: string; label: string }[];
|
||||
};
|
||||
"x-keycloakify": {
|
||||
messages: Record<string, string>;
|
||||
};
|
||||
};
|
||||
|
||||
assert<KcContext extends KcContextLike ? true : false>();
|
||||
|
||||
export type GenericI18n_noJsx<MessageKey extends string> = {
|
||||
/**
|
||||
* e.g: "en", "fr", "zh-CN"
|
||||
*
|
||||
* The current language
|
||||
*/
|
||||
currentLanguageTag: string;
|
||||
/**
|
||||
* Redirect to this url to change the language.
|
||||
* After reload currentLanguageTag === newLanguageTag
|
||||
*/
|
||||
getChangeLocaleUrl: (newLanguageTag: string) => string;
|
||||
/**
|
||||
* e.g. "en" => "English", "fr" => "Français", ...
|
||||
*
|
||||
* Used to render a select that enable user to switch language.
|
||||
* ex: https://user-images.githubusercontent.com/6702424/186044799-38801eec-4e89-483b-81dd-8e9233e8c0eb.png
|
||||
* */
|
||||
labelBySupportedLanguageTag: Record<string, string>;
|
||||
/**
|
||||
*
|
||||
* Examples assuming currentLanguageTag === "en"
|
||||
* {
|
||||
* en: {
|
||||
* "access-denied": "Access denied",
|
||||
* "impersonateTitleHtml": "<strong>{0}</strong> Impersonate User",
|
||||
* "bar": "Bar {0}"
|
||||
* }
|
||||
* }
|
||||
*
|
||||
* msgStr("access-denied") === "Access denied"
|
||||
* msgStr("not-a-message-key") Throws an error
|
||||
* msgStr("impersonateTitleHtml", "Foo") === "<strong>Foo</strong> Impersonate User"
|
||||
* msgStr("${bar}", "<strong>c</strong>") === "Bar <strong>XXX</strong>"
|
||||
* The html in the arg is partially escaped for security reasons, it might come from an untrusted source, it's not safe to render it as html.
|
||||
*/
|
||||
msgStr: (key: MessageKey, ...args: (string | undefined)[]) => string;
|
||||
/**
|
||||
* This is meant to be used when the key argument is variable, something that might have been configured by the user
|
||||
* in the Keycloak admin for example.
|
||||
*
|
||||
* Examples assuming currentLanguageTag === "en"
|
||||
* {
|
||||
* en: {
|
||||
* "access-denied": "Access denied",
|
||||
* }
|
||||
* }
|
||||
*
|
||||
* advancedMsgStr("${access-denied}") === advancedMsgStr("access-denied") === msgStr("access-denied") === "Access denied"
|
||||
* advancedMsgStr("${not-a-message-key}") === advancedMsgStr("not-a-message-key") === "not-a-message-key"
|
||||
*/
|
||||
advancedMsgStr: (key: string, ...args: (string | undefined)[]) => string;
|
||||
|
||||
/**
|
||||
* Initially the messages are in english (fallback language).
|
||||
* The translations in the current language are being fetched dynamically.
|
||||
* This property is true while the translations are being fetched.
|
||||
*/
|
||||
isFetchingTranslations: boolean;
|
||||
};
|
||||
|
||||
export type MessageKey_defaultSet = keyof typeof messages_defaultSet_fallbackLanguage;
|
||||
|
||||
export function createGetI18n<MessageKey_themeDefined extends string = never>(messagesByLanguageTag_themeDefined: {
|
||||
[languageTag: string]: { [key in MessageKey_themeDefined]: string };
|
||||
}) {
|
||||
type I18n = GenericI18n_noJsx<MessageKey_defaultSet | MessageKey_themeDefined>;
|
||||
|
||||
type Result = { i18n: I18n; prI18n_currentLanguage: Promise<I18n> | undefined };
|
||||
|
||||
const cachedResultByKcContext = new WeakMap<KcContextLike, Result>();
|
||||
|
||||
function getI18n(params: { kcContext: KcContextLike }): Result {
|
||||
const { kcContext } = params;
|
||||
|
||||
use_cache: {
|
||||
const cachedResult = cachedResultByKcContext.get(kcContext);
|
||||
|
||||
if (cachedResult === undefined) {
|
||||
break use_cache;
|
||||
}
|
||||
|
||||
return cachedResult;
|
||||
}
|
||||
|
||||
const partialI18n: Pick<I18n, "currentLanguageTag" | "getChangeLocaleUrl" | "labelBySupportedLanguageTag"> = {
|
||||
currentLanguageTag: kcContext.locale?.currentLanguageTag ?? FALLBACK_LANGUAGE_TAG,
|
||||
getChangeLocaleUrl: newLanguageTag => {
|
||||
const { locale } = kcContext;
|
||||
|
||||
assert(locale !== undefined, "Internationalization not enabled");
|
||||
|
||||
const targetSupportedLocale = locale.supported.find(({ languageTag }) => languageTag === newLanguageTag);
|
||||
|
||||
assert(targetSupportedLocale !== undefined, `${newLanguageTag} need to be enabled in Keycloak admin`);
|
||||
|
||||
return targetSupportedLocale.url;
|
||||
},
|
||||
labelBySupportedLanguageTag: Object.fromEntries((kcContext.locale?.supported ?? []).map(({ languageTag, label }) => [languageTag, label]))
|
||||
};
|
||||
|
||||
const { createI18nTranslationFunctions } = createI18nTranslationFunctionsFactory<MessageKey_themeDefined>({
|
||||
messages_themeDefined:
|
||||
messagesByLanguageTag_themeDefined[partialI18n.currentLanguageTag] ??
|
||||
messagesByLanguageTag_themeDefined[FALLBACK_LANGUAGE_TAG] ??
|
||||
(() => {
|
||||
const firstLanguageTag = Object.keys(messagesByLanguageTag_themeDefined)[0];
|
||||
if (firstLanguageTag === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
return messagesByLanguageTag_themeDefined[firstLanguageTag];
|
||||
})(),
|
||||
messages_fromKcServer: kcContext["x-keycloakify"].messages
|
||||
});
|
||||
|
||||
const isCurrentLanguageFallbackLanguage = partialI18n.currentLanguageTag === FALLBACK_LANGUAGE_TAG;
|
||||
|
||||
const result: Result = {
|
||||
i18n: {
|
||||
...partialI18n,
|
||||
...createI18nTranslationFunctions({
|
||||
messages_defaultSet_currentLanguage: isCurrentLanguageFallbackLanguage ? messages_defaultSet_fallbackLanguage : undefined
|
||||
}),
|
||||
isFetchingTranslations: !isCurrentLanguageFallbackLanguage
|
||||
},
|
||||
prI18n_currentLanguage: isCurrentLanguageFallbackLanguage
|
||||
? undefined
|
||||
: (async () => {
|
||||
const messages_defaultSet_currentLanguage = await fetchMessages_defaultSet(partialI18n.currentLanguageTag);
|
||||
|
||||
const i18n_currentLanguage: I18n = {
|
||||
...partialI18n,
|
||||
...createI18nTranslationFunctions({ messages_defaultSet_currentLanguage }),
|
||||
isFetchingTranslations: false
|
||||
};
|
||||
|
||||
// NOTE: This promise.resolve is just because without it we TypeScript
|
||||
// gives a Variable 'result' is used before being assigned. error
|
||||
await Promise.resolve().then(() => {
|
||||
result.i18n = i18n_currentLanguage;
|
||||
result.prI18n_currentLanguage = undefined;
|
||||
});
|
||||
|
||||
return i18n_currentLanguage;
|
||||
})()
|
||||
};
|
||||
|
||||
cachedResultByKcContext.set(kcContext, result);
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
return { getI18n };
|
||||
}
|
||||
|
||||
function createI18nTranslationFunctionsFactory<MessageKey_themeDefined extends string>(params: {
|
||||
messages_themeDefined: Record<MessageKey_themeDefined, string> | undefined;
|
||||
messages_fromKcServer: Record<string, string>;
|
||||
}) {
|
||||
const { messages_themeDefined, messages_fromKcServer } = params;
|
||||
|
||||
function createI18nTranslationFunctions(params: {
|
||||
messages_defaultSet_currentLanguage: Partial<Record<MessageKey_defaultSet, string>> | undefined;
|
||||
}): Pick<GenericI18n_noJsx<MessageKey_defaultSet | MessageKey_themeDefined>, "msgStr" | "advancedMsgStr"> {
|
||||
const { messages_defaultSet_currentLanguage } = params;
|
||||
|
||||
function resolveMsg(props: { key: string; args: (string | undefined)[] }): string | undefined {
|
||||
const { key, args } = props;
|
||||
|
||||
const message =
|
||||
id<Record<string, string | undefined>>(messages_fromKcServer)[key] ??
|
||||
id<Record<string, string | undefined> | undefined>(messages_themeDefined)?.[key] ??
|
||||
id<Record<string, string | undefined> | undefined>(messages_defaultSet_currentLanguage)?.[key] ??
|
||||
id<Record<string, string | undefined>>(messages_defaultSet_fallbackLanguage)[key];
|
||||
|
||||
if (message === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
const startIndex = message
|
||||
.match(/{[0-9]+}/g)
|
||||
?.map(g => g.match(/{([0-9]+)}/)![1])
|
||||
.map(indexStr => parseInt(indexStr))
|
||||
.sort((a, b) => a - b)[0];
|
||||
|
||||
if (startIndex === undefined) {
|
||||
// No {0} in message (no arguments expected)
|
||||
return message;
|
||||
}
|
||||
|
||||
let messageWithArgsInjected = message;
|
||||
|
||||
args.forEach((arg, i) => {
|
||||
if (arg === undefined) {
|
||||
return;
|
||||
}
|
||||
|
||||
messageWithArgsInjected = messageWithArgsInjected.replace(
|
||||
new RegExp(`\\{${i + startIndex}\\}`, "g"),
|
||||
(() => {
|
||||
if (key === "loginTitleHtml") {
|
||||
return arg;
|
||||
}
|
||||
|
||||
return arg.replace(/</g, "<").replace(/>/g, ">");
|
||||
})()
|
||||
);
|
||||
});
|
||||
|
||||
return messageWithArgsInjected;
|
||||
}
|
||||
|
||||
function resolveMsgAdvanced(props: { key: string; args: (string | undefined)[] }): string {
|
||||
const { key, args } = props;
|
||||
|
||||
const match = key.match(/^\$\{(.+)\}$/);
|
||||
|
||||
return resolveMsg({ key: match !== null ? match[1] : key, args }) ?? key;
|
||||
}
|
||||
|
||||
return {
|
||||
msgStr: (key, ...args) => {
|
||||
const resolvedMessage = resolveMsg({ key, args });
|
||||
assert(resolvedMessage !== undefined, `Message with key "${key}" not found`);
|
||||
return resolvedMessage;
|
||||
},
|
||||
advancedMsgStr: (key, ...args) => resolveMsgAdvanced({ key, args })
|
||||
};
|
||||
}
|
||||
|
||||
return { createI18nTranslationFunctions };
|
||||
}
|
||||
@ -1,5 +1,5 @@
|
||||
export * from "./withJsx";
|
||||
import type { GenericI18n } from "./withJsx/GenericI18n";
|
||||
import type { MessageKey as MessageKey_defaultSet } from "./messages_defaultSet/types";
|
||||
/** INTERNAL: DO NOT IMPORT THIS */
|
||||
export type I18n = GenericI18n<MessageKey_defaultSet, string>;
|
||||
import type { GenericI18n } from "./GenericI18n";
|
||||
import type { MessageKey_defaultSet, KcContextLike } from "./i18n";
|
||||
export type { MessageKey_defaultSet, KcContextLike };
|
||||
export type I18n = GenericI18n<MessageKey_defaultSet>;
|
||||
export { createUseI18n } from "./useI18n";
|
||||
|
||||
@ -1,64 +0,0 @@
|
||||
export type GenericI18n_noJsx<MessageKey extends string, LanguageTag extends string> = {
|
||||
currentLanguage: {
|
||||
/**
|
||||
* e.g: "en", "fr", "zh-CN"
|
||||
*
|
||||
* The current language
|
||||
*/
|
||||
languageTag: LanguageTag;
|
||||
/**
|
||||
* e.g: "English", "Français", "中文（简体）"
|
||||
*
|
||||
* The current language
|
||||
*/
|
||||
label: string;
|
||||
};
|
||||
/**
|
||||
* Array of languages enabled on the realm.
|
||||
*/
|
||||
enabledLanguages: {
|
||||
languageTag: LanguageTag;
|
||||
label: string;
|
||||
href: string;
|
||||
}[];
|
||||
/**
|
||||
*
|
||||
* Examples assuming currentLanguageTag === "en"
|
||||
* {
|
||||
* en: {
|
||||
* "access-denied": "Access denied",
|
||||
* "impersonateTitleHtml": "<strong>{0}</strong> Impersonate User",
|
||||
* "bar": "Bar {0}"
|
||||
* }
|
||||
* }
|
||||
*
|
||||
* msgStr("access-denied") === "Access denied"
|
||||
* msgStr("not-a-message-key") Throws an error
|
||||
* msgStr("impersonateTitleHtml", "Foo") === "<strong>Foo</strong> Impersonate User"
|
||||
* msgStr("${bar}", "<strong>c</strong>") === "Bar <strong>XXX</strong>"
|
||||
* The html in the arg is partially escaped for security reasons, it might come from an untrusted source, it's not safe to render it as html.
|
||||
*/
|
||||
msgStr: (key: MessageKey, ...args: (string | undefined)[]) => string;
|
||||
/**
|
||||
* This is meant to be used when the key argument is variable, something that might have been configured by the user
|
||||
* in the Keycloak admin for example.
|
||||
*
|
||||
* Examples assuming currentLanguageTag === "en"
|
||||
* {
|
||||
* en: {
|
||||
* "access-denied": "Access denied",
|
||||
* }
|
||||
* }
|
||||
*
|
||||
* advancedMsgStr("${access-denied}") === advancedMsgStr("access-denied") === msgStr("access-denied") === "Access denied"
|
||||
* advancedMsgStr("${not-a-message-key}") === advancedMsgStr("not-a-message-key") === "not-a-message-key"
|
||||
*/
|
||||
advancedMsgStr: (key: string, ...args: (string | undefined)[]) => string;
|
||||
|
||||
/**
|
||||
* Initially the messages are in english (fallback language).
|
||||
* The translations in the current language are being fetched dynamically.
|
||||
* This property is true while the translations are being fetched.
|
||||
*/
|
||||
isFetchingTranslations: boolean;
|
||||
};
|
||||
@ -1,389 +0,0 @@
|
||||
import "keycloakify/tools/Object.fromEntries";
|
||||
import { assert, is } from "tsafe/assert";
|
||||
import messages_defaultSet_fallbackLanguage from "../messages_defaultSet/en";
|
||||
import { fetchMessages_defaultSet } from "../messages_defaultSet";
|
||||
import type { KcContext } from "../../KcContext";
|
||||
import { FALLBACK_LANGUAGE_TAG } from "keycloakify/bin/shared/constants";
|
||||
import { id } from "tsafe/id";
|
||||
import { Reflect } from "tsafe/Reflect";
|
||||
import {
|
||||
type LanguageTag as LanguageTag_defaultSet,
|
||||
type MessageKey as MessageKey_defaultSet,
|
||||
languageTags as languageTags_defaultSet
|
||||
} from "../messages_defaultSet/types";
|
||||
import type { GenericI18n_noJsx } from "./GenericI18n_noJsx";
|
||||
|
||||
export type KcContextLike = {
|
||||
themeName: string;
|
||||
realm: {
|
||||
internationalizationEnabled: boolean;
|
||||
};
|
||||
locale?: {
|
||||
currentLanguageTag: string;
|
||||
supported: { languageTag: string; url: string; label: string }[];
|
||||
rtl?: boolean;
|
||||
};
|
||||
"x-keycloakify": {
|
||||
messages: Record<string, string>;
|
||||
};
|
||||
};
|
||||
|
||||
assert<KcContext extends KcContextLike ? true : false>();
|
||||
|
||||
export type ReturnTypeOfCreateGetI18n<MessageKey_themeDefined extends string, LanguageTag_notInDefaultSet extends string> = {
|
||||
getI18n: (params: { kcContext: KcContextLike }) => {
|
||||
i18n: GenericI18n_noJsx<MessageKey_defaultSet | MessageKey_themeDefined, LanguageTag_defaultSet | LanguageTag_notInDefaultSet>;
|
||||
prI18n_currentLanguage:
|
||||
| Promise<GenericI18n_noJsx<MessageKey_defaultSet | MessageKey_themeDefined, LanguageTag_defaultSet | LanguageTag_notInDefaultSet>>
|
||||
| undefined;
|
||||
};
|
||||
ofTypeI18n: GenericI18n_noJsx<MessageKey_defaultSet | MessageKey_themeDefined, LanguageTag_defaultSet | LanguageTag_notInDefaultSet>;
|
||||
};
|
||||
|
||||
export function createGetI18n<
|
||||
ThemeName extends string = string,
|
||||
MessageKey_themeDefined extends string = never,
|
||||
LanguageTag_notInDefaultSet extends string = never
|
||||
>(params: {
|
||||
extraLanguageTranslations: {
|
||||
[languageTag in LanguageTag_notInDefaultSet]: {
|
||||
label: string;
|
||||
getMessages: () => Promise<{ default: Record<MessageKey_defaultSet, string> }>;
|
||||
};
|
||||
};
|
||||
messagesByLanguageTag_themeDefined: Partial<{
|
||||
[languageTag in LanguageTag_defaultSet | LanguageTag_notInDefaultSet]: {
|
||||
[key in MessageKey_themeDefined]: string | Record<ThemeName, string>;
|
||||
};
|
||||
}>;
|
||||
}): ReturnTypeOfCreateGetI18n<MessageKey_themeDefined, LanguageTag_notInDefaultSet> {
|
||||
const { extraLanguageTranslations, messagesByLanguageTag_themeDefined } = params;
|
||||
|
||||
Object.keys(extraLanguageTranslations).forEach(languageTag_notInDefaultSet => {
|
||||
if (id<readonly string[]>(languageTags_defaultSet).includes(languageTag_notInDefaultSet)) {
|
||||
throw new Error(
|
||||
[
|
||||
`Language "${languageTag_notInDefaultSet}" is already in the default set, you don't need to provide your own base translations for it`,
|
||||
`If you want to override some translations for this language, you can use the "withCustomTranslations" method`
|
||||
].join(" ")
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
type LanguageTag = LanguageTag_defaultSet | LanguageTag_notInDefaultSet;
|
||||
|
||||
type MessageKey = MessageKey_defaultSet | MessageKey_themeDefined;
|
||||
|
||||
type I18n = GenericI18n_noJsx<MessageKey, LanguageTag>;
|
||||
|
||||
type Result = { i18n: I18n; prI18n_currentLanguage: Promise<I18n> | undefined };
|
||||
|
||||
const cachedResultByKcContext = new WeakMap<KcContextLike, Result>();
|
||||
|
||||
function getI18n(params: { kcContext: KcContextLike }): Result {
|
||||
const { kcContext } = params;
|
||||
|
||||
use_cache: {
|
||||
const cachedResult = cachedResultByKcContext.get(kcContext);
|
||||
|
||||
if (cachedResult === undefined) {
|
||||
break use_cache;
|
||||
}
|
||||
|
||||
return cachedResult;
|
||||
}
|
||||
|
||||
const kcContextLocale = params.kcContext.realm.internationalizationEnabled ? params.kcContext.locale : undefined;
|
||||
|
||||
{
|
||||
const currentLanguageTag = kcContextLocale?.currentLanguageTag ?? FALLBACK_LANGUAGE_TAG;
|
||||
const html = document.querySelector("html");
|
||||
assert(html !== null);
|
||||
html.lang = currentLanguageTag;
|
||||
|
||||
const isRtl = (() => {
|
||||
const { rtl } = kcContextLocale ?? {};
|
||||
|
||||
if (rtl !== undefined) {
|
||||
return rtl;
|
||||
}
|
||||
|
||||
return [
|
||||
/* spell-checker: disable */
|
||||
// Common RTL languages
|
||||
"ar", // Arabic
|
||||
"fa", // Persian (Farsi)
|
||||
"he", // Hebrew
|
||||
"ur", // Urdu
|
||||
"ps", // Pashto
|
||||
"syr", // Syriac
|
||||
"dv", // Divehi (Maldivian)
|
||||
"ku", // Kurdish (Sorani)
|
||||
"ug", // Uighur
|
||||
"az", // Azerbaijani (Arabic script)
|
||||
"sd", // Sindhi
|
||||
|
||||
// Less common RTL languages
|
||||
"yi", // Yiddish
|
||||
"ha", // Hausa (when written in Arabic script)
|
||||
"ks", // Kashmiri (written in the Perso-Arabic script)
|
||||
"bal", // Balochi (when written in Arabic script)
|
||||
"khw", // Khowar (Chitrali)
|
||||
"brh", // Brahui (when written in Arabic script)
|
||||
"tmh", // Tamashek (some dialects use Arabic script)
|
||||
"bgn", // Western Balochi
|
||||
"arc", // Aramaic
|
||||
"sam", // Samaritan Aramaic
|
||||
"prd", // Parsi-Dari (a dialect of Persian)
|
||||
"huz", // Hazaragi (a dialect of Persian)
|
||||
"gbz", // Zaza (written in Arabic script in some areas)
|
||||
"urj" // Urdu in Romanized script (not always RTL, but to account for edge cases)
|
||||
/* spell-checker: enable */
|
||||
].includes(currentLanguageTag);
|
||||
})();
|
||||
|
||||
html.dir = isRtl ? "rtl" : "ltr";
|
||||
}
|
||||
|
||||
const getLanguageLabel = (languageTag: LanguageTag) => {
|
||||
form_user_added_languages: {
|
||||
if (!(languageTag in extraLanguageTranslations)) {
|
||||
break form_user_added_languages;
|
||||
}
|
||||
assert(is<Exclude<LanguageTag, LanguageTag_defaultSet>>(languageTag));
|
||||
|
||||
const entry = extraLanguageTranslations[languageTag];
|
||||
|
||||
return entry.label;
|
||||
}
|
||||
|
||||
from_server: {
|
||||
if (kcContextLocale === undefined) {
|
||||
break from_server;
|
||||
}
|
||||
|
||||
const supportedEntry = kcContextLocale.supported.find(entry => entry.languageTag === languageTag);
|
||||
|
||||
if (supportedEntry === undefined) {
|
||||
break from_server;
|
||||
}
|
||||
|
||||
// cspell: disable-next-line
|
||||
// from "Espagnol (Español)" we want to extract "Español"
|
||||
const match = supportedEntry.label.match(/[^(]+\(([^)]+)\)/);
|
||||
|
||||
if (match !== null) {
|
||||
return match[1];
|
||||
}
|
||||
|
||||
return supportedEntry.label;
|
||||
}
|
||||
|
||||
// NOTE: This should never happen
|
||||
return languageTag;
|
||||
};
|
||||
|
||||
const currentLanguage: I18n["currentLanguage"] = (() => {
|
||||
const languageTag = id<string>(kcContextLocale?.currentLanguageTag ?? FALLBACK_LANGUAGE_TAG) as LanguageTag;
|
||||
|
||||
return {
|
||||
languageTag,
|
||||
label: getLanguageLabel(languageTag)
|
||||
};
|
||||
})();
|
||||
|
||||
const enabledLanguages: I18n["enabledLanguages"] = (() => {
|
||||
const enabledLanguages: I18n["enabledLanguages"] = [];
|
||||
|
||||
if (kcContextLocale !== undefined) {
|
||||
for (const entry of kcContextLocale.supported ?? []) {
|
||||
const languageTag = id<string>(entry.languageTag) as LanguageTag;
|
||||
|
||||
enabledLanguages.push({
|
||||
languageTag,
|
||||
label: getLanguageLabel(languageTag),
|
||||
href: entry.url
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
if (enabledLanguages.find(({ languageTag }) => languageTag === currentLanguage.languageTag) === undefined) {
|
||||
enabledLanguages.push({
|
||||
languageTag: currentLanguage.languageTag,
|
||||
label: getLanguageLabel(currentLanguage.languageTag),
|
||||
href: "#"
|
||||
});
|
||||
}
|
||||
|
||||
return enabledLanguages;
|
||||
})();
|
||||
|
||||
const { createI18nTranslationFunctions } = createI18nTranslationFunctionsFactory<MessageKey_themeDefined>({
|
||||
themeName: kcContext.themeName,
|
||||
messages_themeDefined:
|
||||
messagesByLanguageTag_themeDefined[currentLanguage.languageTag] ??
|
||||
messagesByLanguageTag_themeDefined[id<string>(FALLBACK_LANGUAGE_TAG) as LanguageTag] ??
|
||||
(() => {
|
||||
const firstLanguageTag = Object.keys(messagesByLanguageTag_themeDefined)[0];
|
||||
if (firstLanguageTag === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
return messagesByLanguageTag_themeDefined[firstLanguageTag as LanguageTag];
|
||||
})(),
|
||||
messages_fromKcServer: kcContext["x-keycloakify"].messages
|
||||
});
|
||||
|
||||
const isCurrentLanguageFallbackLanguage = currentLanguage.languageTag === FALLBACK_LANGUAGE_TAG;
|
||||
|
||||
const result: Result = {
|
||||
i18n: {
|
||||
currentLanguage,
|
||||
enabledLanguages,
|
||||
...createI18nTranslationFunctions({
|
||||
messages_defaultSet_currentLanguage: isCurrentLanguageFallbackLanguage ? messages_defaultSet_fallbackLanguage : undefined
|
||||
}),
|
||||
isFetchingTranslations: !isCurrentLanguageFallbackLanguage
|
||||
},
|
||||
prI18n_currentLanguage: isCurrentLanguageFallbackLanguage
|
||||
? undefined
|
||||
: (async () => {
|
||||
const messages_defaultSet_currentLanguage = await (async () => {
|
||||
const currentLanguageTag = currentLanguage.languageTag;
|
||||
|
||||
const fromDefaultSet = await fetchMessages_defaultSet(currentLanguageTag);
|
||||
|
||||
const isEmpty = (() => {
|
||||
for (let _key in fromDefaultSet) {
|
||||
return false;
|
||||
}
|
||||
|
||||
return true;
|
||||
})();
|
||||
|
||||
if (isEmpty) {
|
||||
assert(is<Exclude<LanguageTag, LanguageTag_defaultSet>>(currentLanguageTag));
|
||||
|
||||
const entry = extraLanguageTranslations[currentLanguageTag];
|
||||
|
||||
assert(entry !== undefined);
|
||||
|
||||
return entry.getMessages().then(({ default: messages }) => messages);
|
||||
}
|
||||
|
||||
return fromDefaultSet;
|
||||
})();
|
||||
|
||||
const i18n_currentLanguage: I18n = {
|
||||
currentLanguage,
|
||||
enabledLanguages,
|
||||
...createI18nTranslationFunctions({ messages_defaultSet_currentLanguage }),
|
||||
isFetchingTranslations: false
|
||||
};
|
||||
|
||||
// NOTE: This promise.resolve is just because without it we TypeScript
|
||||
// gives a Variable 'result' is used before being assigned. error
|
||||
await Promise.resolve().then(() => {
|
||||
result.i18n = i18n_currentLanguage;
|
||||
result.prI18n_currentLanguage = undefined;
|
||||
});
|
||||
|
||||
return i18n_currentLanguage;
|
||||
})()
|
||||
};
|
||||
|
||||
cachedResultByKcContext.set(kcContext, result);
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
return {
|
||||
getI18n,
|
||||
ofTypeI18n: Reflect<I18n>()
|
||||
};
|
||||
}
|
||||
|
||||
function createI18nTranslationFunctionsFactory<MessageKey_themeDefined extends string>(params: {
|
||||
themeName: string;
|
||||
messages_themeDefined: Record<MessageKey_themeDefined, string | Record<string, string>> | undefined;
|
||||
messages_fromKcServer: Record<string, string>;
|
||||
}) {
|
||||
const { themeName, messages_themeDefined, messages_fromKcServer } = params;
|
||||
|
||||
function createI18nTranslationFunctions(params: {
|
||||
messages_defaultSet_currentLanguage: Partial<Record<MessageKey_defaultSet, string>> | undefined;
|
||||
}): Pick<GenericI18n_noJsx<MessageKey_defaultSet | MessageKey_themeDefined, string>, "msgStr" | "advancedMsgStr"> {
|
||||
const { messages_defaultSet_currentLanguage } = params;
|
||||
|
||||
function resolveMsg(props: { key: string; args: (string | undefined)[] }): string | undefined {
|
||||
const { key, args } = props;
|
||||
|
||||
const message =
|
||||
id<Record<string, string | undefined>>(messages_fromKcServer)[key] ??
|
||||
(() => {
|
||||
const messageOrMap = id<Record<string, string | Record<string, string> | undefined> | undefined>(messages_themeDefined)?.[key];
|
||||
|
||||
if (messageOrMap === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
if (typeof messageOrMap === "string") {
|
||||
return messageOrMap;
|
||||
}
|
||||
|
||||
const message = messageOrMap[themeName];
|
||||
|
||||
assert(message !== undefined, `No translation for theme variant "${themeName}" for key "${key}"`);
|
||||
|
||||
return message;
|
||||
})() ??
|
||||
id<Record<string, string | undefined> | undefined>(messages_defaultSet_currentLanguage)?.[key] ??
|
||||
id<Record<string, string | undefined>>(messages_defaultSet_fallbackLanguage)[key];
|
||||
|
||||
if (message === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
const startIndex = message
|
||||
.match(/{[0-9]+}/g)
|
||||
?.map(g => g.match(/{([0-9]+)}/)![1])
|
||||
.map(indexStr => parseInt(indexStr))
|
||||
.sort((a, b) => a - b)[0];
|
||||
|
||||
if (startIndex === undefined) {
|
||||
// No {0} in message (no arguments expected)
|
||||
return message;
|
||||
}
|
||||
|
||||
let messageWithArgsInjected = message;
|
||||
|
||||
args.forEach((arg, i) => {
|
||||
if (arg === undefined) {
|
||||
return;
|
||||
}
|
||||
|
||||
messageWithArgsInjected = messageWithArgsInjected.replace(new RegExp(`\\{${i + startIndex}\\}`, "g"), arg);
|
||||
});
|
||||
|
||||
return messageWithArgsInjected;
|
||||
}
|
||||
|
||||
function resolveMsgAdvanced(props: { key: string; args: (string | undefined)[] }): string {
|
||||
const { key, args } = props;
|
||||
|
||||
const match = key.match(/^\$\{(.+)\}$/);
|
||||
|
||||
return resolveMsg({ key: match !== null ? match[1] : key, args }) ?? key;
|
||||
}
|
||||
|
||||
return {
|
||||
msgStr: (key, ...args) => {
|
||||
const resolvedMessage = resolveMsg({ key, args });
|
||||
assert(resolvedMessage !== undefined, `Message with key "${key}" not found`);
|
||||
return resolvedMessage;
|
||||
},
|
||||
advancedMsgStr: (key, ...args) => resolveMsgAdvanced({ key, args })
|
||||
};
|
||||
}
|
||||
|
||||
return { createI18nTranslationFunctions };
|
||||
}
|
||||
@ -1,117 +0,0 @@
|
||||
import type {
|
||||
LanguageTag as LanguageTag_defaultSet,
|
||||
MessageKey as MessageKey_defaultSet
|
||||
} from "../messages_defaultSet/types";
|
||||
import { type ReturnTypeOfCreateGetI18n, createGetI18n } from "./getI18n";
|
||||
|
||||
export type I18nBuilder<
|
||||
ThemeName extends string = never,
|
||||
MessageKey_themeDefined extends string = never,
|
||||
LanguageTag_notInDefaultSet extends string = never,
|
||||
ExcludedMethod extends
|
||||
| "withThemeName"
|
||||
| "withExtraLanguages"
|
||||
| "withCustomTranslations" = never
|
||||
> = Omit<
|
||||
{
|
||||
withThemeName: <ThemeName extends string>() => I18nBuilder<
|
||||
ThemeName,
|
||||
MessageKey_themeDefined,
|
||||
LanguageTag_notInDefaultSet,
|
||||
ExcludedMethod | "withThemeName"
|
||||
>;
|
||||
withExtraLanguages: <
|
||||
LanguageTag_notInDefaultSet extends string
|
||||
>(extraLanguageTranslations: {
|
||||
[LanguageTag in LanguageTag_notInDefaultSet]: {
|
||||
label: string;
|
||||
getMessages: () => Promise<{
|
||||
default: Record<MessageKey_defaultSet, string>;
|
||||
}>;
|
||||
};
|
||||
}) => I18nBuilder<
|
||||
ThemeName,
|
||||
MessageKey_themeDefined,
|
||||
LanguageTag_notInDefaultSet,
|
||||
ExcludedMethod | "withExtraLanguages"
|
||||
>;
|
||||
withCustomTranslations: <MessageKey_themeDefined extends string>(
|
||||
messagesByLanguageTag_themeDefined: Partial<{
|
||||
[LanguageTag in
|
||||
| LanguageTag_defaultSet
|
||||
| LanguageTag_notInDefaultSet]: Record<
|
||||
MessageKey_themeDefined,
|
||||
string | Record<ThemeName, string>
|
||||
>;
|
||||
}>
|
||||
) => I18nBuilder<
|
||||
ThemeName,
|
||||
MessageKey_themeDefined,
|
||||
LanguageTag_notInDefaultSet,
|
||||
ExcludedMethod | "withCustomTranslations"
|
||||
>;
|
||||
build: () => ReturnTypeOfCreateGetI18n<
|
||||
MessageKey_themeDefined,
|
||||
LanguageTag_notInDefaultSet
|
||||
>;
|
||||
},
|
||||
ExcludedMethod
|
||||
>;
|
||||
|
||||
function createI18nBuilder<
|
||||
ThemeName extends string = never,
|
||||
MessageKey_themeDefined extends string = never,
|
||||
LanguageTag_notInDefaultSet extends string = never
|
||||
>(params: {
|
||||
extraLanguageTranslations: {
|
||||
[LanguageTag in LanguageTag_notInDefaultSet]: {
|
||||
label: string;
|
||||
getMessages: () => Promise<{
|
||||
default: Record<MessageKey_defaultSet, string>;
|
||||
}>;
|
||||
};
|
||||
};
|
||||
messagesByLanguageTag_themeDefined: Partial<{
|
||||
[LanguageTag in LanguageTag_defaultSet | LanguageTag_notInDefaultSet]: Record<
|
||||
MessageKey_themeDefined,
|
||||
string | Record<ThemeName, string>
|
||||
>;
|
||||
}>;
|
||||
}): I18nBuilder<ThemeName, MessageKey_themeDefined, LanguageTag_notInDefaultSet> {
|
||||
const i18nBuilder: I18nBuilder<
|
||||
ThemeName,
|
||||
MessageKey_themeDefined,
|
||||
LanguageTag_notInDefaultSet
|
||||
> = {
|
||||
withThemeName: () =>
|
||||
createI18nBuilder({
|
||||
extraLanguageTranslations: params.extraLanguageTranslations,
|
||||
messagesByLanguageTag_themeDefined:
|
||||
params.messagesByLanguageTag_themeDefined as any
|
||||
}),
|
||||
withExtraLanguages: extraLanguageTranslations =>
|
||||
createI18nBuilder({
|
||||
extraLanguageTranslations,
|
||||
messagesByLanguageTag_themeDefined:
|
||||
params.messagesByLanguageTag_themeDefined as any
|
||||
}),
|
||||
withCustomTranslations: messagesByLanguageTag_themeDefined =>
|
||||
createI18nBuilder({
|
||||
extraLanguageTranslations: params.extraLanguageTranslations,
|
||||
messagesByLanguageTag_themeDefined
|
||||
}),
|
||||
build: () =>
|
||||
createGetI18n({
|
||||
extraLanguageTranslations: params.extraLanguageTranslations,
|
||||
messagesByLanguageTag_themeDefined:
|
||||
params.messagesByLanguageTag_themeDefined
|
||||
})
|
||||
};
|
||||
|
||||
return i18nBuilder;
|
||||
}
|
||||
|
||||
export const i18nBuilder = createI18nBuilder({
|
||||
extraLanguageTranslations: {},
|
||||
messagesByLanguageTag_themeDefined: {}
|
||||
});
|
||||
@ -1,3 +0,0 @@
|
||||
export { i18nBuilder } from "./i18nBuilder";
|
||||
export type { KcContextLike } from "./getI18n";
|
||||
export type { MessageKey as MessageKey_defaultSet } from "../messages_defaultSet/types";
|
||||
95
src/login/i18n/useI18n.tsx
Normal file
95
src/login/i18n/useI18n.tsx
Normal file
@ -0,0 +1,95 @@
|
||||
import { useEffect, useState } from "react";
|
||||
import { createGetI18n, type GenericI18n_noJsx, type KcContextLike, type MessageKey_defaultSet } from "./i18n";
|
||||
import { GenericI18n } from "./GenericI18n";
|
||||
import { Reflect } from "tsafe/Reflect";
|
||||
|
||||
export function createUseI18n<MessageKey_themeDefined extends string = never>(messagesByLanguageTag: {
|
||||
[languageTag: string]: { [key in MessageKey_themeDefined]: string };
|
||||
}) {
|
||||
type MessageKey = MessageKey_defaultSet | MessageKey_themeDefined;
|
||||
|
||||
type I18n = GenericI18n<MessageKey>;
|
||||
|
||||
const { withJsx } = (() => {
|
||||
const cache = new WeakMap<GenericI18n_noJsx<MessageKey>, GenericI18n<MessageKey>>();
|
||||
|
||||
function renderHtmlString(params: { htmlString: string; msgKey: string }): JSX.Element {
|
||||
const { htmlString, msgKey } = params;
|
||||
return (
|
||||
<div
|
||||
data-kc-msg={msgKey}
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: htmlString
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
function withJsx(i18n_noJsx: GenericI18n_noJsx<MessageKey>): I18n {
|
||||
use_cache: {
|
||||
const i18n = cache.get(i18n_noJsx);
|
||||
|
||||
if (i18n === undefined) {
|
||||
break use_cache;
|
||||
}
|
||||
|
||||
return i18n;
|
||||
}
|
||||
|
||||
const i18n: I18n = {
|
||||
...i18n_noJsx,
|
||||
msg: (msgKey, ...args) => renderHtmlString({ htmlString: i18n_noJsx.msgStr(msgKey, ...args), msgKey }),
|
||||
advancedMsg: (msgKey, ...args) => renderHtmlString({ htmlString: i18n_noJsx.advancedMsgStr(msgKey, ...args), msgKey })
|
||||
};
|
||||
|
||||
cache.set(i18n_noJsx, i18n);
|
||||
|
||||
return i18n;
|
||||
}
|
||||
|
||||
return { withJsx };
|
||||
})();
|
||||
|
||||
add_style: {
|
||||
const attributeName = "data-kc-i18n";
|
||||
|
||||
// Check if already exists in head
|
||||
if (document.querySelector(`style[${attributeName}]`) !== null) {
|
||||
break add_style;
|
||||
}
|
||||
|
||||
const styleElement = document.createElement("style");
|
||||
styleElement.attributes.setNamedItem(document.createAttribute(attributeName));
|
||||
(styleElement.textContent = `[data-kc-msg] { display: inline-block; }`), document.head.prepend(styleElement);
|
||||
}
|
||||
|
||||
const { getI18n } = createGetI18n(messagesByLanguageTag);
|
||||
|
||||
function useI18n(params: { kcContext: KcContextLike }): { i18n: I18n } {
|
||||
const { kcContext } = params;
|
||||
|
||||
const { i18n, prI18n_currentLanguage } = getI18n({ kcContext });
|
||||
|
||||
const [i18n_toReturn, setI18n_toReturn] = useState<I18n>(withJsx(i18n));
|
||||
|
||||
useEffect(() => {
|
||||
let isActive = true;
|
||||
|
||||
prI18n_currentLanguage?.then(i18n => {
|
||||
if (!isActive) {
|
||||
return;
|
||||
}
|
||||
|
||||
setI18n_toReturn(withJsx(i18n));
|
||||
});
|
||||
|
||||
return () => {
|
||||
isActive = false;
|
||||
};
|
||||
}, []);
|
||||
|
||||
return { i18n: i18n_toReturn };
|
||||
}
|
||||
|
||||
return { useI18n, ofTypeI18n: Reflect<I18n>() };
|
||||
}
|
||||
@ -1,81 +0,0 @@
|
||||
import type { GenericI18n_noJsx } from "../noJsx/GenericI18n_noJsx";
|
||||
import { assert, type Equals } from "tsafe/assert";
|
||||
|
||||
export type GenericI18n<MessageKey extends string, LanguageTag extends string> = {
|
||||
currentLanguage: {
|
||||
/**
|
||||
* e.g: "en", "fr", "zh-CN"
|
||||
*
|
||||
* The current language
|
||||
*/
|
||||
languageTag: LanguageTag;
|
||||
/**
|
||||
* e.g: "English", "Français", "中文（简体）"
|
||||
*
|
||||
* The current language
|
||||
*/
|
||||
label: string;
|
||||
};
|
||||
/**
|
||||
* Array of languages enabled on the realm.
|
||||
*/
|
||||
enabledLanguages: {
|
||||
languageTag: LanguageTag;
|
||||
label: string;
|
||||
href: string;
|
||||
}[];
|
||||
/**
|
||||
*
|
||||
* Examples assuming currentLanguageTag === "en"
|
||||
* {
|
||||
* en: {
|
||||
* "access-denied": "Access denied",
|
||||
* "impersonateTitleHtml": "<strong>{0}</strong> Impersonate User",
|
||||
* "bar": "Bar {0}"
|
||||
* }
|
||||
* }
|
||||
*
|
||||
* msgStr("access-denied") === "Access denied"
|
||||
* msgStr("not-a-message-key") Throws an error
|
||||
* msgStr("impersonateTitleHtml", "Foo") === "<strong>Foo</strong> Impersonate User"
|
||||
* msgStr("${bar}", "<strong>c</strong>") === "Bar <strong>XXX</strong>"
|
||||
* The html in the arg is partially escaped for security reasons, it might come from an untrusted source, it's not safe to render it as html.
|
||||
*/
|
||||
msgStr: (key: MessageKey, ...args: (string | undefined)[]) => string;
|
||||
/**
|
||||
* This is meant to be used when the key argument is variable, something that might have been configured by the user
|
||||
* in the Keycloak admin for example.
|
||||
*
|
||||
* Examples assuming currentLanguageTag === "en"
|
||||
* {
|
||||
* en: {
|
||||
* "access-denied": "Access denied",
|
||||
* }
|
||||
* }
|
||||
*
|
||||
* advancedMsgStr("${access-denied}") === advancedMsgStr("access-denied") === msgStr("access-denied") === "Access denied"
|
||||
* advancedMsgStr("${not-a-message-key}") === advancedMsgStr("not-a-message-key") === "not-a-message-key"
|
||||
*/
|
||||
advancedMsgStr: (key: string, ...args: (string | undefined)[]) => string;
|
||||
/**
|
||||
* Initially the messages are in english (fallback language).
|
||||
* The translations in the current language are being fetched dynamically.
|
||||
* This property is true while the translations are being fetched.
|
||||
*/
|
||||
isFetchingTranslations: boolean;
|
||||
/**
|
||||
* Same as msgStr but returns a JSX.Element with the html string rendered as html.
|
||||
*/
|
||||
msg: (key: MessageKey, ...args: (string | undefined)[]) => JSX.Element;
|
||||
/**
|
||||
* Same as advancedMsgStr but returns a JSX.Element with the html string rendered as html.
|
||||
*/
|
||||
advancedMsg: (key: string, ...args: (string | undefined)[]) => JSX.Element;
|
||||
};
|
||||
|
||||
{
|
||||
type A = Omit<GenericI18n<string, string>, "msg" | "advancedMsg">;
|
||||
type B = GenericI18n_noJsx<string, string>;
|
||||
|
||||
assert<Equals<A, B>>;
|
||||
}
|
||||
@ -1,117 +0,0 @@
|
||||
import type {
|
||||
LanguageTag as LanguageTag_defaultSet,
|
||||
MessageKey as MessageKey_defaultSet
|
||||
} from "../messages_defaultSet/types";
|
||||
import { type ReturnTypeOfCreateUseI18n, createUseI18n } from "../withJsx/useI18n";
|
||||
|
||||
export type I18nBuilder<
|
||||
ThemeName extends string = never,
|
||||
MessageKey_themeDefined extends string = never,
|
||||
LanguageTag_notInDefaultSet extends string = never,
|
||||
ExcludedMethod extends
|
||||
| "withThemeName"
|
||||
| "withExtraLanguages"
|
||||
| "withCustomTranslations" = never
|
||||
> = Omit<
|
||||
{
|
||||
withThemeName: <ThemeName extends string>() => I18nBuilder<
|
||||
ThemeName,
|
||||
MessageKey_themeDefined,
|
||||
LanguageTag_notInDefaultSet,
|
||||
ExcludedMethod | "withThemeName"
|
||||
>;
|
||||
withExtraLanguages: <
|
||||
LanguageTag_notInDefaultSet extends string
|
||||
>(extraLanguageTranslations: {
|
||||
[LanguageTag in LanguageTag_notInDefaultSet]: {
|
||||
label: string;
|
||||
getMessages: () => Promise<{
|
||||
default: Record<MessageKey_defaultSet, string>;
|
||||
}>;
|
||||
};
|
||||
}) => I18nBuilder<
|
||||
ThemeName,
|
||||
MessageKey_themeDefined,
|
||||
LanguageTag_notInDefaultSet,
|
||||
ExcludedMethod | "withExtraLanguages"
|
||||
>;
|
||||
withCustomTranslations: <MessageKey_themeDefined extends string>(
|
||||
messagesByLanguageTag_themeDefined: Partial<{
|
||||
[LanguageTag in
|
||||
| LanguageTag_defaultSet
|
||||
| LanguageTag_notInDefaultSet]: Record<
|
||||
MessageKey_themeDefined,
|
||||
string | Record<ThemeName, string>
|
||||
>;
|
||||
}>
|
||||
) => I18nBuilder<
|
||||
ThemeName,
|
||||
MessageKey_themeDefined,
|
||||
LanguageTag_notInDefaultSet,
|
||||
ExcludedMethod | "withCustomTranslations"
|
||||
>;
|
||||
build: () => ReturnTypeOfCreateUseI18n<
|
||||
MessageKey_themeDefined,
|
||||
LanguageTag_notInDefaultSet
|
||||
>;
|
||||
},
|
||||
ExcludedMethod
|
||||
>;
|
||||
|
||||
function createI18nBuilder<
|
||||
ThemeName extends string = never,
|
||||
MessageKey_themeDefined extends string = never,
|
||||
LanguageTag_notInDefaultSet extends string = never
|
||||
>(params: {
|
||||
extraLanguageTranslations: {
|
||||
[LanguageTag in LanguageTag_notInDefaultSet]: {
|
||||
label: string;
|
||||
getMessages: () => Promise<{
|
||||
default: Record<MessageKey_defaultSet, string>;
|
||||
}>;
|
||||
};
|
||||
};
|
||||
messagesByLanguageTag_themeDefined: Partial<{
|
||||
[LanguageTag in LanguageTag_defaultSet | LanguageTag_notInDefaultSet]: Record<
|
||||
MessageKey_themeDefined,
|
||||
string | Record<ThemeName, string>
|
||||
>;
|
||||
}>;
|
||||
}): I18nBuilder<ThemeName, MessageKey_themeDefined, LanguageTag_notInDefaultSet> {
|
||||
const i18nBuilder: I18nBuilder<
|
||||
ThemeName,
|
||||
MessageKey_themeDefined,
|
||||
LanguageTag_notInDefaultSet
|
||||
> = {
|
||||
withThemeName: () =>
|
||||
createI18nBuilder({
|
||||
extraLanguageTranslations: params.extraLanguageTranslations,
|
||||
messagesByLanguageTag_themeDefined:
|
||||
params.messagesByLanguageTag_themeDefined as any
|
||||
}),
|
||||
withExtraLanguages: extraLanguageTranslations =>
|
||||
createI18nBuilder({
|
||||
extraLanguageTranslations,
|
||||
messagesByLanguageTag_themeDefined:
|
||||
params.messagesByLanguageTag_themeDefined as any
|
||||
}),
|
||||
withCustomTranslations: messagesByLanguageTag_themeDefined =>
|
||||
createI18nBuilder({
|
||||
extraLanguageTranslations: params.extraLanguageTranslations,
|
||||
messagesByLanguageTag_themeDefined
|
||||
}),
|
||||
build: () =>
|
||||
createUseI18n({
|
||||
extraLanguageTranslations: params.extraLanguageTranslations,
|
||||
messagesByLanguageTag_themeDefined:
|
||||
params.messagesByLanguageTag_themeDefined
|
||||
})
|
||||
};
|
||||
|
||||
return i18nBuilder;
|
||||
}
|
||||
|
||||
export const i18nBuilder = createI18nBuilder({
|
||||
extraLanguageTranslations: {},
|
||||
messagesByLanguageTag_themeDefined: {}
|
||||
});
|
||||
@ -1,3 +0,0 @@
|
||||
export { i18nBuilder } from "./i18nBuilder";
|
||||
export type { KcContextLike } from "./useI18n";
|
||||
export type { MessageKey as MessageKey_defaultSet } from "../messages_defaultSet/types";
|
||||
@ -1,128 +0,0 @@
|
||||
import { useEffect, useState } from "react";
|
||||
import { kcSanitize } from "keycloakify/lib/kcSanitize";
|
||||
import { createGetI18n, type KcContextLike } from "../noJsx/getI18n";
|
||||
import type { GenericI18n_noJsx } from "../noJsx/GenericI18n_noJsx";
|
||||
import { Reflect } from "tsafe/Reflect";
|
||||
import type { GenericI18n } from "./GenericI18n";
|
||||
import type { LanguageTag as LanguageTag_defaultSet, MessageKey as MessageKey_defaultSet } from "../messages_defaultSet/types";
|
||||
|
||||
export type ReturnTypeOfCreateUseI18n<MessageKey_themeDefined extends string, LanguageTag_notInDefaultSet extends string> = {
|
||||
useI18n: (params: { kcContext: KcContextLike }) => {
|
||||
i18n: GenericI18n<MessageKey_defaultSet | MessageKey_themeDefined, LanguageTag_defaultSet | LanguageTag_notInDefaultSet>;
|
||||
};
|
||||
ofTypeI18n: GenericI18n<MessageKey_defaultSet | MessageKey_themeDefined, LanguageTag_defaultSet | LanguageTag_notInDefaultSet>;
|
||||
};
|
||||
|
||||
export { KcContextLike };
|
||||
|
||||
export function createUseI18n<
|
||||
ThemeName extends string = string,
|
||||
MessageKey_themeDefined extends string = never,
|
||||
LanguageTag_notInDefaultSet extends string = never
|
||||
>(params: {
|
||||
extraLanguageTranslations: {
|
||||
[languageTag in LanguageTag_notInDefaultSet]: {
|
||||
label: string;
|
||||
getMessages: () => Promise<{ default: Record<MessageKey_defaultSet, string> }>;
|
||||
};
|
||||
};
|
||||
messagesByLanguageTag_themeDefined: Partial<{
|
||||
[languageTag in LanguageTag_defaultSet | LanguageTag_notInDefaultSet]: {
|
||||
[key in MessageKey_themeDefined]: string | Record<ThemeName, string>;
|
||||
};
|
||||
}>;
|
||||
}): ReturnTypeOfCreateUseI18n<MessageKey_themeDefined, LanguageTag_notInDefaultSet> {
|
||||
const { extraLanguageTranslations, messagesByLanguageTag_themeDefined } = params;
|
||||
|
||||
type LanguageTag = LanguageTag_defaultSet | LanguageTag_notInDefaultSet;
|
||||
|
||||
type MessageKey = MessageKey_defaultSet | MessageKey_themeDefined;
|
||||
|
||||
type I18n = GenericI18n<MessageKey, LanguageTag>;
|
||||
|
||||
type Result = { i18n: I18n };
|
||||
|
||||
const { withJsx } = (() => {
|
||||
const cache = new WeakMap<GenericI18n_noJsx<MessageKey, LanguageTag>, GenericI18n<MessageKey, LanguageTag>>();
|
||||
|
||||
function renderHtmlString(params: { htmlString: string; msgKey: string }): JSX.Element {
|
||||
const { htmlString, msgKey } = params;
|
||||
return (
|
||||
<div
|
||||
data-kc-msg={msgKey}
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: kcSanitize(htmlString)
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
function withJsx(i18n_noJsx: GenericI18n_noJsx<MessageKey, LanguageTag>): I18n {
|
||||
use_cache: {
|
||||
const i18n = cache.get(i18n_noJsx);
|
||||
|
||||
if (i18n === undefined) {
|
||||
break use_cache;
|
||||
}
|
||||
|
||||
return i18n;
|
||||
}
|
||||
|
||||
const i18n: I18n = {
|
||||
...i18n_noJsx,
|
||||
msg: (msgKey, ...args) => renderHtmlString({ htmlString: i18n_noJsx.msgStr(msgKey, ...args), msgKey }),
|
||||
advancedMsg: (msgKey, ...args) => renderHtmlString({ htmlString: i18n_noJsx.advancedMsgStr(msgKey, ...args), msgKey })
|
||||
};
|
||||
|
||||
cache.set(i18n_noJsx, i18n);
|
||||
|
||||
return i18n;
|
||||
}
|
||||
|
||||
return { withJsx };
|
||||
})();
|
||||
|
||||
add_style: {
|
||||
const attributeName = "data-kc-i18n";
|
||||
|
||||
// Check if already exists in head
|
||||
if (document.querySelector(`style[${attributeName}]`) !== null) {
|
||||
break add_style;
|
||||
}
|
||||
|
||||
const styleElement = document.createElement("style");
|
||||
styleElement.attributes.setNamedItem(document.createAttribute(attributeName));
|
||||
styleElement.textContent = `[data-kc-msg] { display: inline-block; }`;
|
||||
document.head.prepend(styleElement);
|
||||
}
|
||||
|
||||
const { getI18n } = createGetI18n({ extraLanguageTranslations, messagesByLanguageTag_themeDefined });
|
||||
|
||||
function useI18n(params: { kcContext: KcContextLike }): Result {
|
||||
const { kcContext } = params;
|
||||
|
||||
const { i18n, prI18n_currentLanguage } = getI18n({ kcContext });
|
||||
|
||||
const [i18n_toReturn, setI18n_toReturn] = useState<I18n>(withJsx(i18n));
|
||||
|
||||
useEffect(() => {
|
||||
let isActive = true;
|
||||
|
||||
prI18n_currentLanguage?.then(i18n => {
|
||||
if (!isActive) {
|
||||
return;
|
||||
}
|
||||
|
||||
setI18n_toReturn(withJsx(i18n));
|
||||
});
|
||||
|
||||
return () => {
|
||||
isActive = false;
|
||||
};
|
||||
}, []);
|
||||
|
||||
return { i18n: i18n_toReturn };
|
||||
}
|
||||
|
||||
return { useI18n, ofTypeI18n: Reflect<I18n>() };
|
||||
}
|
||||
@ -1,3 +1,3 @@
|
||||
export type { ExtendKcContext, Attribute } from "keycloakify/login/KcContext";
|
||||
export type { ClassKey } from "keycloakify/login/TemplateProps";
|
||||
export { i18nBuilder, type MessageKey_defaultSet } from "keycloakify/login/i18n";
|
||||
export { createUseI18n } from "keycloakify/login/i18n";
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -1 +0,0 @@
|
||||
export * from "./getUserProfileApi";
|
||||
@ -1,109 +0,0 @@
|
||||
import { assert } from "keycloakify/tools/assert";
|
||||
let cleanup: (() => void) | undefined;
|
||||
const handledElements = new WeakSet<HTMLElement>();
|
||||
const KC_NUMBER_UNFORMAT = "kcNumberUnFormat";
|
||||
const SELECTOR = `input[data-${KC_NUMBER_UNFORMAT}]`;
|
||||
|
||||
export function unFormatNumberOnSubmit() {
|
||||
cleanup?.();
|
||||
|
||||
const handleElement = (element: HTMLInputElement) => {
|
||||
if (handledElements.has(element)) {
|
||||
return;
|
||||
}
|
||||
|
||||
const form = element.closest("form");
|
||||
|
||||
if (form === null) {
|
||||
return;
|
||||
}
|
||||
|
||||
form.addEventListener("submit", () => {
|
||||
const rawFormat = element.getAttribute(`data-${KC_NUMBER_UNFORMAT}`);
|
||||
if (rawFormat) {
|
||||
element.value = formatNumber(element.value, rawFormat);
|
||||
}
|
||||
});
|
||||
|
||||
handledElements.add(element);
|
||||
};
|
||||
|
||||
document.querySelectorAll(SELECTOR).forEach(element => {
|
||||
assert(element instanceof HTMLInputElement);
|
||||
handleElement(element);
|
||||
});
|
||||
|
||||
const observer = new MutationObserver(mutationsList => {
|
||||
for (const mutation of mutationsList) {
|
||||
if (mutation.type === "childList" && mutation.addedNodes.length > 0) {
|
||||
mutation.addedNodes.forEach(node => {
|
||||
if (node.nodeType === Node.ELEMENT_NODE) {
|
||||
const element = (node as HTMLElement).querySelector(SELECTOR);
|
||||
if (element !== null) {
|
||||
assert(element instanceof HTMLInputElement);
|
||||
handleElement(element);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
observer.observe(document.body, { childList: true, subtree: true });
|
||||
|
||||
cleanup = () => observer.disconnect();
|
||||
}
|
||||
|
||||
// NOTE: Keycloak code
|
||||
const formatNumber = (input: string, format: string) => {
|
||||
if (!input) {
|
||||
return "";
|
||||
}
|
||||
|
||||
// array holding the patterns for the number of expected digits in each part
|
||||
const digitPattern = format.match(/{\d+}/g);
|
||||
|
||||
if (!digitPattern) {
|
||||
return "";
|
||||
}
|
||||
|
||||
// calculate the maximum size of the given pattern based on the sum of the expected digits
|
||||
const maxSize = digitPattern.reduce(
|
||||
(total, p) => total + parseInt(p.replace("{", "").replace("}", "")),
|
||||
0
|
||||
);
|
||||
|
||||
// keep only digits
|
||||
let rawValue = input.replace(/\D+/g, "");
|
||||
|
||||
// make sure the value is a number
|
||||
//@ts-expect-error
|
||||
if (parseInt(rawValue) != rawValue) {
|
||||
return "";
|
||||
}
|
||||
|
||||
// make sure the number of digits does not exceed the maximum size
|
||||
if (rawValue.length > maxSize) {
|
||||
rawValue = rawValue.substring(0, maxSize);
|
||||
}
|
||||
|
||||
// build the regex based based on the expected digits in each part
|
||||
const formatter = digitPattern.reduce((result, p) => result + `(\\d${p})`, "^");
|
||||
|
||||
// if the current digits match the pattern we have each group of digits in an array
|
||||
let digits = new RegExp(formatter).exec(rawValue);
|
||||
|
||||
// no match, return the raw value without any format
|
||||
if (!digits) {
|
||||
return input;
|
||||
}
|
||||
|
||||
let result = format;
|
||||
|
||||
// finally format the current digits accordingly to the given format
|
||||
for (let i = 0; i < digitPattern.length; i++) {
|
||||
result = result.replace(digitPattern[i], digits[i + 1]);
|
||||
}
|
||||
|
||||
return result;
|
||||
};
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user