Compare commits
1 Commits
Author | SHA1 | Date | |
---|---|---|---|
8ec11d81f6 |
@ -1,7 +1,3 @@
|
||||
### **0.0.11** (2021-02-23)
|
||||
|
||||
- Add documentation
|
||||
|
||||
### **0.0.10** (2021-02-23)
|
||||
|
||||
- Remove extra closing bracket
|
||||
|
96
README.md
96
README.md
@ -2,7 +2,7 @@
|
||||
<img src="https://user-images.githubusercontent.com/6702424/80216211-00ef5280-863e-11ea-81de-59f3a3d4b8e4.png">
|
||||
</p>
|
||||
<p align="center">
|
||||
<i>🔏 Keycloak theme generator for Reacts app💅</i>
|
||||
<i>Provides a way to customize Keycloak login and register pages with React</i>
|
||||
<br>
|
||||
<br>
|
||||
<img src="https://github.com/garronej/keycloak-react-theming/workflows/ci/badge.svg?branch=develop">
|
||||
@ -10,87 +10,31 @@
|
||||
<img src="https://img.shields.io/npm/dw/keycloak-react-theming">
|
||||
<img src="https://img.shields.io/npm/l/keycloak-react-theming">
|
||||
</p>
|
||||
<p align="center">
|
||||
<a href="https://github.com/garronej/keycloak-react-theming">Home</a>
|
||||
-
|
||||
<a href="https://github.com/garronej/keycloak-react-theming">Documentation</a>
|
||||
</p>
|
||||
|
||||
# MOTIVATION
|
||||
# REQUIREMENT
|
||||
## For building the theme:
|
||||
|
||||
The problem:
|
||||
- `mvn` must be installed
|
||||
|
||||

|
||||
## For development, (testing the theme on a docker container ect ):
|
||||
|
||||
When we redirected to Keycloak the user suffers from a harsh context switch.
|
||||
The language is set back to default and the theme is different,
|
||||
- `rm`
|
||||
- `mkdir` )
|
||||
- `wget`
|
||||
- `unzip`
|
||||
|
||||
Keycloak does offer a way to customize the theme of theses pages but it will require a lot of raw HTML/CSS hacking
|
||||
to reproduce the look and feel of your app. Not mentioning the maintenance cost of such an endeavour.
|
||||
Tested on MacOS
|
||||
|
||||
Wouldn't it be great if we could just design the login and register pages as if they where part of our app while
|
||||
still letting Keycloak handle the heavy lifting of actually authenticating the users?
|
||||
# USAGE
|
||||
|
||||
Here is `yarn add keycloak-react-theming` for you 🍸
|
||||
## Build the theme:
|
||||
`npx build-keycloak-theme`
|
||||
|
||||

|
||||

|
||||

|
||||
## (Optional/Debug) Download more themes:
|
||||
|
||||
# How to use
|
||||
|
||||
## Setting up the build tool
|
||||
|
||||
Add `keycloak-react-theming` to the dev dependencies of your project `npm install --save-dev keycloak-react-theming` or `yarn add --dev keycloak-react-theming`
|
||||
then configure your `package.json` build's script to build the keycloak's theme by adding `&& build-keycloak-theme`.
|
||||
|
||||
Typically you will get:
|
||||
|
||||
`package.json`:
|
||||
```json
|
||||
"devDependencies": {
|
||||
"keycloak-react-theming": "^0.0.10",
|
||||
[...]
|
||||
},
|
||||
"scripts": {
|
||||
"build": "react-scripts build && build-keycloak-theme",
|
||||
[...]
|
||||
},
|
||||
```
|
||||
|
||||
Then build your app with `yarn run build` or `npm run build`, you will be provided with instructions
|
||||
about how to load the theme into Keycloak.
|
||||
|
||||
## Developing your login and register pages in your React app
|
||||
|
||||
TODO
|
||||
|
||||
# How to implement context persistance
|
||||
|
||||
If you want dark mode preference, language and others users preferences your can do so
|
||||
very easily by using [`powerhooks/useGlobalState`](https://github.com/garronej/powerhooks)
|
||||
|
||||
WARNING: `powerhooks` is still a work in progress.
|
||||
|
||||
# REQUIREMENTS
|
||||
|
||||
This tools assumes you are bundling your app with Webpack (tested with 4.44.2) .
|
||||
It assumes there is a `build/` directory at the root of your react project directory containing a `index.html` file
|
||||
and a `static/` directory generated by webpack.
|
||||
|
||||
**All this is defaults with [`create-react-app`](https://create-react-app.dev)** (tested with 4.0.3=)
|
||||
|
||||
- For building the theme: `mvn` (Maven) must be installed
|
||||
- For development, (testing the theme in a local container ): `rm`, `mkdir`, `wget`, `unzip` are assumed to be available.
|
||||
|
||||
NOTE: This build tool has only be tested on MacOS.
|
||||
|
||||
# API Reference
|
||||
|
||||
## The build tool
|
||||
|
||||
Part of the lib that runs with node, at build time.
|
||||
|
||||
- `npx build-keycloak-theme`: Builds the theme, the CWD is assumed to be the root of your react project.
|
||||
- `npx download-sample-keycloak-themes`: Downloads the keycloak default themes (for development purposes)
|
||||
|
||||
## The fronted lib ( imported into your react
|
||||
|
||||
Part of the lib that you import in your react project and runs on the browser.
|
||||
|
||||
**TODO**
|
||||
`npx download-sample-keycloak-themes`
|
||||
|
@ -1,4 +1,3 @@
|
||||
export declare const containerLaunchScriptBasename = "start_keycloak_testing_container.sh";
|
||||
/** Files for being able to run a hot reload keycloak container */
|
||||
export declare function generateDebugFiles(params: {
|
||||
packageJsonName: string;
|
||||
|
@ -19,10 +19,9 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
||||
return result;
|
||||
};
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.generateDebugFiles = exports.containerLaunchScriptBasename = void 0;
|
||||
exports.generateDebugFiles = void 0;
|
||||
var fs = __importStar(require("fs"));
|
||||
var path_1 = require("path");
|
||||
exports.containerLaunchScriptBasename = "start_keycloak_testing_container.sh";
|
||||
/** Files for being able to run a hot reload keycloak container */
|
||||
function generateDebugFiles(params) {
|
||||
var packageJsonName = params.packageJsonName, keycloakThemeBuildingDirPath = params.keycloakThemeBuildingDirPath;
|
||||
@ -39,7 +38,7 @@ function generateDebugFiles(params) {
|
||||
].join("\n"), "utf8"));
|
||||
var dockerImage = packageJsonName + "/keycloak-hot-reload";
|
||||
var containerName = "keycloak-testing-container";
|
||||
fs.writeFileSync(path_1.join(keycloakThemeBuildingDirPath, exports.containerLaunchScriptBasename), Buffer.from([
|
||||
fs.writeFileSync(path_1.join(keycloakThemeBuildingDirPath, "start_keycloak_testing_container.sh"), Buffer.from([
|
||||
"#!/bin/bash",
|
||||
"",
|
||||
"docker rm " + containerName + " || true",
|
||||
|
@ -1 +1 @@
|
||||
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/bin/build-keycloak-theme/generateDebugFiles/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AACA,qCAAyB;AACzB,6BAA0F;AAE7E,QAAA,6BAA6B,GAAG,qCAAqC,CAAC;AAEnF,kEAAkE;AAClE,SAAgB,kBAAkB,CAC9B,MAGC;IAGO,IAAA,eAAe,GAAmC,MAAM,gBAAzC,EAAE,4BAA4B,GAAK,MAAM,6BAAX,CAAY;IAEjE,EAAE,CAAC,aAAa,CACZ,WAAQ,CAAC,4BAA4B,EAAE,YAAY,CAAC,EACpD,MAAM,CAAC,IAAI,CACP;QACI,4BAA4B;QAC5B,EAAE;QACF,WAAW;QACX,EAAE;QACF,WAAW;QACX,EAAE;QACF,iEAAiE;QACjE,EAAE;QACF,wDAAwD;KAC3D,CAAC,IAAI,CAAC,IAAI,CAAC,EACZ,MAAM,CACT,CACJ,CAAC;IAEF,IAAM,WAAW,GAAM,eAAe,yBAAsB,CAAC;IAC7D,IAAM,aAAa,GAAG,4BAA4B,CAAC;IAEnD,EAAE,CAAC,aAAa,CACZ,WAAQ,CAAC,4BAA4B,EAAE,qCAA6B,CAAC,EACrE,MAAM,CAAC,IAAI,CACP;QACI,aAAa;QACb,EAAE;QACF,eAAa,aAAa,aAAU;QACpC,EAAE;QACF,uBAAqB,WAAa;QAClC,EAAE;QACF,eAAe;QACf,kBAAkB;QAClB,cAAW,aAAa,QAAK;QAC7B,4BAA4B;QAC5B,gCAAgC;QAChC,UAAO,WAAQ,CAAC,4BAA4B,EAAE,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,OAAO,EAAE,eAAe,CAAC,oCACpE,eAAe,WAAQ;QACtD,WAAQ,WAAW,YAAS;QAC5B,EAAE;KACL,CAAC,IAAI,CAAC,IAAI,CAAC,EACZ,MAAM,CACT,EACD,EAAE,MAAM,EAAE,GAAK,EAAE,CACpB,CAAC;IAEF,IAAM,oBAAoB,GAAG,WAAQ,CAAC,4BAA4B,EAAE,eAAe,EAAE,mBAAmB,CAAC,CAAC;IAE1G,IAAI;QAAE,EAAE,CAAC,SAAS,CAAC,cAAW,CAAC,oBAAoB,CAAC,CAAC,CAAC;KAAE;IAAC,WAAM,GAAG;IAElE,EAAE,CAAC,aAAa,CACZ,oBAAoB,EACpB,EAAE,CAAC,YAAY,CAAC,WAAQ,CAAC,SAAS,EAAE,eAAY,CAAC,oBAAoB,CAAC,CAAC,CAAC,CAC3E,CAAC;AAEN,CAAC;AAhED,gDAgEC"}
|
||||
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/bin/build-keycloak-theme/generateDebugFiles/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AACA,qCAAyB;AACzB,6BAA0F;AAE1F,kEAAkE;AAClE,SAAgB,kBAAkB,CAC9B,MAGC;IAGO,IAAA,eAAe,GAAmC,MAAM,gBAAzC,EAAE,4BAA4B,GAAK,MAAM,6BAAX,CAAY;IAEjE,EAAE,CAAC,aAAa,CACZ,WAAQ,CAAC,4BAA4B,EAAE,YAAY,CAAC,EACpD,MAAM,CAAC,IAAI,CACP;QACI,4BAA4B;QAC5B,EAAE;QACF,WAAW;QACX,EAAE;QACF,WAAW;QACX,EAAE;QACF,iEAAiE;QACjE,EAAE;QACF,wDAAwD;KAC3D,CAAC,IAAI,CAAC,IAAI,CAAC,EACZ,MAAM,CACT,CACJ,CAAC;IAEF,IAAM,WAAW,GAAM,eAAe,yBAAsB,CAAC;IAC7D,IAAM,aAAa,GAAG,4BAA4B,CAAC;IAEnD,EAAE,CAAC,aAAa,CACZ,WAAQ,CAAC,4BAA4B,EAAE,qCAAqC,CAAC,EAC7E,MAAM,CAAC,IAAI,CACP;QACI,aAAa;QACb,EAAE;QACF,eAAa,aAAa,aAAU;QACpC,EAAE;QACF,uBAAqB,WAAa;QAClC,EAAE;QACF,eAAe;QACf,kBAAkB;QAClB,cAAW,aAAa,QAAK;QAC7B,4BAA4B;QAC5B,gCAAgC;QAChC,UAAO,WAAQ,CAAC,4BAA4B,EAAE,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,OAAO,EAAE,eAAe,CAAC,oCACpE,eAAe,WAAQ;QACtD,WAAQ,WAAW,YAAS;QAC5B,EAAE;KACL,CAAC,IAAI,CAAC,IAAI,CAAC,EACZ,MAAM,CACT,EACD,EAAE,MAAM,EAAE,GAAK,EAAE,CACpB,CAAC;IAEF,IAAM,oBAAoB,GAAG,WAAQ,CAAC,4BAA4B,EAAE,eAAe,EAAE,mBAAmB,CAAC,CAAC;IAE1G,IAAI;QAAE,EAAE,CAAC,SAAS,CAAC,cAAW,CAAC,oBAAoB,CAAC,CAAC,CAAC;KAAE;IAAC,WAAM,GAAG;IAElE,EAAE,CAAC,aAAa,CACZ,oBAAoB,EACpB,EAAE,CAAC,YAAY,CAAC,WAAQ,CAAC,SAAS,EAAE,eAAY,CAAC,oBAAoB,CAAC,CAAC,CAAC,CAC3E,CAAC;AAEN,CAAC;AAhED,gDAgEC"}
|
@ -6,6 +6,4 @@ export declare type ParsedPackageJson = {
|
||||
export declare function generateJavaStackFiles(params: {
|
||||
parsedPackageJson: ParsedPackageJson;
|
||||
keycloakThemeBuildingDirPath: string;
|
||||
}): {
|
||||
jarFilePath: string;
|
||||
};
|
||||
}): void;
|
||||
|
@ -66,7 +66,6 @@ function generateJavaStackFiles(params) {
|
||||
]
|
||||
}, null, 2), "utf8"));
|
||||
}
|
||||
return { "jarFilePath": path_1.join(keycloakThemeBuildingDirPath, "target", name + "-" + version + ".jar") };
|
||||
}
|
||||
exports.generateJavaStackFiles = generateJavaStackFiles;
|
||||
//# sourceMappingURL=generateJavaStackFiles.js.map
|
@ -1 +1 @@
|
||||
{"version":3,"file":"generateJavaStackFiles.js","sourceRoot":"","sources":["../../src/bin/build-keycloak-theme/generateJavaStackFiles.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AACA,uCAA2B;AAC3B,qCAAyB;AACzB,6BAAgE;AAQhE,SAAgB,sBAAsB,CAClC,MAGC;IAIG,IAAA,KAEA,MAAM,kBAFwC,EAAzB,IAAI,UAAA,EAAE,OAAO,aAAA,EAAE,QAAQ,cAAA,EAC5C,4BAA4B,GAC5B,MAAM,6BADsB,CACrB;IAEX;QAEY,IAAA,WAAW,GAAK,CAAC,SAAS,mBAAmB;YAGjD,IAAM,OAAO,GAAG,CAAC;;gBAEb,IAAM,eAAe,GAAG,qDAAmD,IAAM,CAAC;gBAElF,OAAO,CAAC,CAAC,QAAQ,CAAC,CAAC;oBACf,eAAe,CAAC,CAAC,aACjB,GAAG,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,IAAI,0CAAE,KAAK,CAAC,GAAG,EAAE,OAAO,GAAG,IAAI,CAAC,GAAG,oCAAK,eAAe,CAC9E,GAAG,WAAW,CAAC;YAEpB,CAAC,CAAC,EAAE,CAAC;YAEL,IAAM,UAAU,GAAM,IAAI,oBAAiB,CAAC;YAE5C,IAAM,WAAW,GAAG;gBAChB,yBAAuB;gBACvB,sDAAoD;gBACpD,2DAAwD;gBACxD,sGAAmG;gBACnG,sCAAqC;gBACrC,gBAAa,OAAO,eAAY;gBAChC,mBAAgB,UAAU,kBAAe;gBACzC,gBAAa,OAAO,eAAY;gBAChC,aAAU,UAAU,YAAS;gBAC7B,mBAAkB;gBAClB,YAAY;aACf,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAEb,OAAO,EAAE,WAAW,aAAA,EAAE,CAAC;QAE3B,CAAC,CAAC,EAAE,YAhCe,CAgCd;QAEL,EAAE,CAAC,aAAa,CACZ,WAAQ,CAAC,4BAA4B,EAAE,SAAS,CAAC,EACjD,MAAM,CAAC,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,CACnC,CAAC;KAEL;IAED;QAEI,IAAM,qBAAqB,GAAG,WAAQ,CAClC,4BAA4B,EAAE,KAAK,EAAE,MAAM,EAC3C,WAAW,EAAE,UAAU,EAAE,sBAAsB,CAClD,CAAC;QAEF,IAAI;YAEA,EAAE,CAAC,SAAS,CAAC,cAAW,CAAC,qBAAqB,CAAC,CAAC,CAAC;SAEpD;QAAC,WAAM,GAAG;QAEX,EAAE,CAAC,aAAa,CACZ,qBAAqB,EACrB,MAAM,CAAC,IAAI,CACP,IAAI,CAAC,SAAS,CAAC;YACX,QAAQ,EAAE;gBACN;oBACI,MAAM,EAAE,IAAI;oBACZ,OAAO,EAAE,CAAC,OAAO,CAAC;iBACrB;aACJ;SACJ,EAAE,IAAI,EAAE,CAAC,CAAC,EACX,MAAM,CACT,CACJ,CAAC;KAEL;IAED,OAAO,EAAE,aAAa,EAAE,WAAQ,CAAC,4BAA4B,EAAE,QAAQ,EAAK,IAAI,SAAI,OAAO,SAAM,CAAC,EAAE,CAAC;AAEzG,CAAC;AAvFD,wDAuFC"}
|
||||
{"version":3,"file":"generateJavaStackFiles.js","sourceRoot":"","sources":["../../src/bin/build-keycloak-theme/generateJavaStackFiles.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AACA,uCAA2B;AAC3B,qCAAyB;AACzB,6BAAgE;AAQhE,SAAgB,sBAAsB,CAClC,MAGC;IAIG,IAAA,KAEA,MAAM,kBAFwC,EAAzB,IAAI,UAAA,EAAE,OAAO,aAAA,EAAE,QAAQ,cAAA,EAC5C,4BAA4B,GAC5B,MAAM,6BADsB,CACrB;IAEX;QAEY,IAAA,WAAW,GAAK,CAAC,SAAS,mBAAmB;YAGjD,IAAM,OAAO,GAAG,CAAC;;gBAEb,IAAM,eAAe,GAAG,qDAAmD,IAAM,CAAC;gBAElF,OAAO,CAAC,CAAC,QAAQ,CAAC,CAAC;oBACf,eAAe,CAAC,CAAC,aACjB,GAAG,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,IAAI,0CAAE,KAAK,CAAC,GAAG,EAAE,OAAO,GAAG,IAAI,CAAC,GAAG,oCAAK,eAAe,CAC9E,GAAG,WAAW,CAAC;YAEpB,CAAC,CAAC,EAAE,CAAC;YAEL,IAAM,UAAU,GAAM,IAAI,oBAAiB,CAAC;YAE5C,IAAM,WAAW,GAAG;gBAChB,yBAAuB;gBACvB,sDAAoD;gBACpD,2DAAwD;gBACxD,sGAAmG;gBACnG,sCAAqC;gBACrC,gBAAa,OAAO,eAAY;gBAChC,mBAAgB,UAAU,kBAAe;gBACzC,gBAAa,OAAO,eAAY;gBAChC,aAAU,UAAU,YAAS;gBAC7B,mBAAkB;gBAClB,YAAY;aACf,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAEb,OAAO,EAAE,WAAW,aAAA,EAAE,CAAC;QAE3B,CAAC,CAAC,EAAE,YAhCe,CAgCd;QAEL,EAAE,CAAC,aAAa,CACZ,WAAQ,CAAC,4BAA4B,EAAE,SAAS,CAAC,EACjD,MAAM,CAAC,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,CACnC,CAAC;KAEL;IAED;QAEI,IAAM,qBAAqB,GAAG,WAAQ,CAClC,4BAA4B,EAAE,KAAK,EAAE,MAAM,EAC3C,WAAW,EAAE,UAAU,EAAE,sBAAsB,CAClD,CAAC;QAEF,IAAI;YAEA,EAAE,CAAC,SAAS,CAAC,cAAW,CAAC,qBAAqB,CAAC,CAAC,CAAC;SAEpD;QAAC,WAAM,GAAG;QAEX,EAAE,CAAC,aAAa,CACZ,qBAAqB,EACrB,MAAM,CAAC,IAAI,CACP,IAAI,CAAC,SAAS,CAAC;YACX,QAAQ,EAAE;gBACN;oBACI,MAAM,EAAE,IAAI;oBACZ,OAAO,EAAE,CAAC,OAAO,CAAC;iBACrB;aACJ;SACJ,EAAE,IAAI,EAAE,CAAC,CAAC,EACX,MAAM,CACT,CACJ,CAAC;KAEL;AAEL,CAAC;AArFD,wDAqFC"}
|
@ -29,52 +29,20 @@ var generateDebugFiles_1 = require("./generateDebugFiles");
|
||||
var reactProjectDirPath = process.cwd();
|
||||
var parsedPackageJson = require(path_1.join(reactProjectDirPath, "package.json"));
|
||||
exports.keycloakThemeBuildingDirPath = path_1.join(reactProjectDirPath, "build_keycloak");
|
||||
console.log("🔏 Building the keycloak theme...⌚");
|
||||
if (require.main === module) {
|
||||
generateKeycloakThemeResources_1.generateKeycloakThemeResources({
|
||||
keycloakThemeBuildingDirPath: exports.keycloakThemeBuildingDirPath,
|
||||
"reactAppBuildDirPath": path_1.join(reactProjectDirPath, "build"),
|
||||
"themeName": parsedPackageJson.name
|
||||
});
|
||||
var jarFilePath = generateJavaStackFiles_1.generateJavaStackFiles({
|
||||
generateJavaStackFiles_1.generateJavaStackFiles({
|
||||
parsedPackageJson: parsedPackageJson,
|
||||
keycloakThemeBuildingDirPath: exports.keycloakThemeBuildingDirPath
|
||||
}).jarFilePath;
|
||||
});
|
||||
child_process.execSync("mvn package", { "cwd": exports.keycloakThemeBuildingDirPath });
|
||||
generateDebugFiles_1.generateDebugFiles({
|
||||
keycloakThemeBuildingDirPath: exports.keycloakThemeBuildingDirPath,
|
||||
"packageJsonName": parsedPackageJson.name
|
||||
});
|
||||
console.log([
|
||||
'',
|
||||
"\u2705 Your keycloak theme has been generated and bundled into ./" + path_1.relative(reactProjectDirPath, jarFilePath) + " \uD83D\uDE80",
|
||||
"It is to be placed in \"/opt/jboss/keycloak/standalone/deployments\" in the container running a jboss/keycloak Docker image. (Tested with 11.0.3)",
|
||||
'',
|
||||
'Using Helm (https://github.com/codecentric/helm-charts), edit to reflect:',
|
||||
'',
|
||||
'value.yaml: ',
|
||||
' extraInitContainers: |',
|
||||
' - name: realm-ext-provider',
|
||||
' image: curlimages/curl',
|
||||
' imagePullPolicy: IfNotPresent',
|
||||
' command:',
|
||||
' - sh',
|
||||
' args:',
|
||||
' - -c',
|
||||
" - curl -L -f -S -o /extensions/" + path_1.basename(jarFilePath) + " https://AN.URL.FOR/" + path_1.basename(jarFilePath),
|
||||
' volumeMounts:',
|
||||
' - name: extensions',
|
||||
' mountPath: /extensions',
|
||||
' ',
|
||||
' extraVolumeMounts: |',
|
||||
' - name: extensions',
|
||||
' mountPath: /opt/jboss/keycloak/standalone/deployments',
|
||||
'',
|
||||
"To enable the theme within keycloak log into the admin console, go to your realm settings, click on the theme tab then select " + parsedPackageJson.name + " ",
|
||||
'',
|
||||
'To test your theme locally you can spin up a Keycloak container image with the theme loaded by running:',
|
||||
'',
|
||||
"$ ./" + path_1.relative(reactProjectDirPath, path_1.join(exports.keycloakThemeBuildingDirPath, generateDebugFiles_1.containerLaunchScriptBasename))
|
||||
].join("\n"));
|
||||
}
|
||||
//# sourceMappingURL=index.js.map
|
@ -1 +1 @@
|
||||
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/bin/build-keycloak-theme/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAEA,mFAAkF;AAClF,mEAAkE;AAElE,6BAA4F;AAC5F,2DAA+C;AAC/C,2DAAyF;AAGzF,IAAM,mBAAmB,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC;AAE1C,IAAM,iBAAiB,GAAsB,OAAO,CAAC,WAAQ,CAAC,mBAAmB,EAAE,cAAc,CAAC,CAAC,CAAC;AAEvF,QAAA,4BAA4B,GAAG,WAAQ,CAAC,mBAAmB,EAAE,gBAAgB,CAAC,CAAC;AAG5F,OAAO,CAAC,GAAG,CAAC,oCAAoC,CAAC,CAAC;AAElD,IAAI,OAAO,CAAC,IAAI,KAAK,MAAM,EAAE;IAEzB,+DAA8B,CAAC;QAC3B,4BAA4B,sCAAA;QAC5B,sBAAsB,EAAE,WAAQ,CAAC,mBAAmB,EAAE,OAAO,CAAC;QAC9D,WAAW,EAAE,iBAAiB,CAAC,IAAI;KACtC,CAAC,CAAC;IAEK,IAAA,WAAW,GAAK,+CAAsB,CAAC;QAC3C,iBAAiB,mBAAA;QACjB,4BAA4B,sCAAA;KAC/B,CAAC,YAHiB,CAGhB;IAEH,aAAa,CAAC,QAAQ,CAClB,aAAa,EACb,EAAE,KAAK,EAAE,oCAA4B,EAAE,CAC1C,CAAC;IAEF,uCAAkB,CAAC;QACf,4BAA4B,sCAAA;QAC5B,iBAAiB,EAAE,iBAAiB,CAAC,IAAI;KAC5C,CAAC,CAAC;IAEH,OAAO,CAAC,GAAG,CAAC;QACR,EAAE;QACF,sEAA+D,eAAY,CAAC,mBAAmB,EAAE,WAAW,CAAC,kBAAK;QAClH,mJAAiJ;QACjJ,EAAE;QACF,2EAA2E;QAC3E,EAAE;QACF,cAAc;QACd,4BAA4B;QAC5B,oCAAoC;QACpC,kCAAkC;QAClC,yCAAyC;QACzC,oBAAoB;QACpB,kBAAkB;QAClB,iBAAiB;QACjB,kBAAkB;QAClB,gDAA8C,eAAY,CAAC,WAAW,CAAC,4BAAuB,eAAY,CAAC,WAAW,CAAG;QACzH,yBAAyB;QACzB,gCAAgC;QAChC,sCAAsC;QACtC,UAAU;QACV,8BAA8B;QAC9B,gCAAgC;QAChC,qEAAqE;QACrE,EAAE;QACF,mIAAiI,iBAAiB,CAAC,IAAI,MAAG;QAC1J,EAAE;QACF,yGAAyG;QACzG,EAAE;QACF,SAAO,eAAY,CAAC,mBAAmB,EAAE,WAAQ,CAAC,oCAA4B,EAAE,kDAA6B,CAAC,CAAG;KACpH,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;CAEjB"}
|
||||
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/bin/build-keycloak-theme/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAEA,mFAAkF;AAClF,mEAAkE;AAElE,6BAAwC;AACxC,2DAA+C;AAC/C,2DAA0D;AAE1D,IAAM,mBAAmB,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC;AAE1C,IAAM,iBAAiB,GAAsB,OAAO,CAAC,WAAQ,CAAC,mBAAmB,EAAE,cAAc,CAAC,CAAC,CAAC;AAEvF,QAAA,4BAA4B,GAAG,WAAQ,CAAC,mBAAmB,EAAE,gBAAgB,CAAC,CAAC;AAE5F,IAAI,OAAO,CAAC,IAAI,KAAK,MAAM,EAAE;IAEzB,+DAA8B,CAAC;QAC3B,4BAA4B,sCAAA;QAC5B,sBAAsB,EAAE,WAAQ,CAAC,mBAAmB,EAAE,OAAO,CAAC;QAC9D,WAAW,EAAE,iBAAiB,CAAC,IAAI;KACtC,CAAC,CAAC;IAEH,+CAAsB,CAAC;QACnB,iBAAiB,mBAAA;QACjB,4BAA4B,sCAAA;KAC/B,CAAC,CAAC;IAEH,aAAa,CAAC,QAAQ,CAClB,aAAa,EACb,EAAE,KAAK,EAAE,oCAA4B,EAAE,CAC1C,CAAC;IAEF,uCAAkB,CAAC;QACf,4BAA4B,sCAAA;QAC5B,iBAAiB,EAAE,iBAAiB,CAAC,IAAI;KAC5C,CAAC,CAAC;CAEN"}
|
4
package-lock.json
generated
4
package-lock.json
generated
@ -1,11 +1,11 @@
|
||||
{
|
||||
"name": "keycloak-react-theming",
|
||||
"version": "0.0.11",
|
||||
"version": "0.0.10",
|
||||
"lockfileVersion": 2,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"version": "0.0.11",
|
||||
"version": "0.0.10",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"cheerio": "^1.0.0-rc.5"
|
||||
|
@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "keycloak-react-theming",
|
||||
"version": "0.0.11",
|
||||
"description": "Keycloak theme generator for Reacts app",
|
||||
"version": "0.0.10",
|
||||
"description": "Provides a way to customize Keycloak login and register pages with React",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/garronej/keycloak-react-theming.git"
|
||||
|
@ -2,8 +2,6 @@
|
||||
import * as fs from "fs";
|
||||
import { join as pathJoin, dirname as pathDirname, basename as pathBasename } from "path";
|
||||
|
||||
export const containerLaunchScriptBasename = "start_keycloak_testing_container.sh";
|
||||
|
||||
/** Files for being able to run a hot reload keycloak container */
|
||||
export function generateDebugFiles(
|
||||
params: {
|
||||
@ -36,7 +34,7 @@ export function generateDebugFiles(
|
||||
const containerName = "keycloak-testing-container";
|
||||
|
||||
fs.writeFileSync(
|
||||
pathJoin(keycloakThemeBuildingDirPath, containerLaunchScriptBasename),
|
||||
pathJoin(keycloakThemeBuildingDirPath, "start_keycloak_testing_container.sh"),
|
||||
Buffer.from(
|
||||
[
|
||||
"#!/bin/bash",
|
||||
|
@ -14,7 +14,7 @@ export function generateJavaStackFiles(
|
||||
parsedPackageJson: ParsedPackageJson;
|
||||
keycloakThemeBuildingDirPath: string;
|
||||
}
|
||||
): { jarFilePath: string; } {
|
||||
): void {
|
||||
|
||||
const {
|
||||
parsedPackageJson: { name, version, homepage },
|
||||
@ -94,7 +94,5 @@ export function generateJavaStackFiles(
|
||||
|
||||
}
|
||||
|
||||
return { "jarFilePath": pathJoin(keycloakThemeBuildingDirPath, "target", `${name}-${version}.jar`) };
|
||||
|
||||
}
|
||||
|
||||
|
@ -3,10 +3,9 @@
|
||||
import { generateKeycloakThemeResources } from "./generateKeycloakThemeResources";
|
||||
import { generateJavaStackFiles } from "./generateJavaStackFiles";
|
||||
import type { ParsedPackageJson } from "./generateJavaStackFiles";
|
||||
import { join as pathJoin, relative as pathRelative, basename as pathBasename } from "path";
|
||||
import { join as pathJoin } from "path";
|
||||
import * as child_process from "child_process";
|
||||
import { generateDebugFiles, containerLaunchScriptBasename } from "./generateDebugFiles";
|
||||
|
||||
import { generateDebugFiles } from "./generateDebugFiles";
|
||||
|
||||
const reactProjectDirPath = process.cwd();
|
||||
|
||||
@ -14,9 +13,6 @@ const parsedPackageJson: ParsedPackageJson = require(pathJoin(reactProjectDirPat
|
||||
|
||||
export const keycloakThemeBuildingDirPath = pathJoin(reactProjectDirPath, "build_keycloak");
|
||||
|
||||
|
||||
console.log("🔏 Building the keycloak theme...⌚");
|
||||
|
||||
if (require.main === module) {
|
||||
|
||||
generateKeycloakThemeResources({
|
||||
@ -25,7 +21,7 @@ if (require.main === module) {
|
||||
"themeName": parsedPackageJson.name
|
||||
});
|
||||
|
||||
const { jarFilePath } = generateJavaStackFiles({
|
||||
generateJavaStackFiles({
|
||||
parsedPackageJson,
|
||||
keycloakThemeBuildingDirPath
|
||||
});
|
||||
@ -40,36 +36,4 @@ if (require.main === module) {
|
||||
"packageJsonName": parsedPackageJson.name
|
||||
});
|
||||
|
||||
console.log([
|
||||
'',
|
||||
`✅ Your keycloak theme has been generated and bundled into ./${pathRelative(reactProjectDirPath, jarFilePath)} 🚀`,
|
||||
`It is to be placed in "/opt/jboss/keycloak/standalone/deployments" in the container running a jboss/keycloak Docker image. (Tested with 11.0.3)`,
|
||||
'',
|
||||
'Using Helm (https://github.com/codecentric/helm-charts), edit to reflect:',
|
||||
'',
|
||||
'value.yaml: ',
|
||||
' extraInitContainers: |',
|
||||
' - name: realm-ext-provider',
|
||||
' image: curlimages/curl',
|
||||
' imagePullPolicy: IfNotPresent',
|
||||
' command:',
|
||||
' - sh',
|
||||
' args:',
|
||||
' - -c',
|
||||
` - curl -L -f -S -o /extensions/${pathBasename(jarFilePath)} https://AN.URL.FOR/${pathBasename(jarFilePath)}`,
|
||||
' volumeMounts:',
|
||||
' - name: extensions',
|
||||
' mountPath: /extensions',
|
||||
' ',
|
||||
' extraVolumeMounts: |',
|
||||
' - name: extensions',
|
||||
' mountPath: /opt/jboss/keycloak/standalone/deployments',
|
||||
'',
|
||||
`To enable the theme within keycloak log into the admin console, go to your realm settings, click on the theme tab then select ${parsedPackageJson.name} `,
|
||||
'',
|
||||
'To test your theme locally you can spin up a Keycloak container image with the theme loaded by running:',
|
||||
'',
|
||||
`$ ./${pathRelative(reactProjectDirPath, pathJoin(keycloakThemeBuildingDirPath, containerLaunchScriptBasename))}`
|
||||
].join("\n"));
|
||||
|
||||
}
|
||||
|
@ -252,17 +252,17 @@
|
||||
"affectsGlobalScope": false
|
||||
},
|
||||
"../src/bin/build-keycloak-theme/generateJavaStackFiles.ts": {
|
||||
"version": "9ce7db79f73f7e02e5c50134e826f9fe4c7a48c6d248ad0d500196d3606f1321",
|
||||
"signature": "557c16c024b7430c3da3f19a980eca355acaa8275713ad3bc3fd91329248b921",
|
||||
"version": "5ea7c3fa0f38cf5fb8d975843226927a2711c2d4407fe54f59cdc4a36761a49e",
|
||||
"signature": "9467ef96692034313a18433a9f0ba9586d47d0d8b0862b756a94d58b0910660e",
|
||||
"affectsGlobalScope": false
|
||||
},
|
||||
"../src/bin/build-keycloak-theme/generateDebugFiles/index.ts": {
|
||||
"version": "7ed04e9e9768ab4256d5d51bf12323ded0ecef891c1a100f34211903f9a3f149",
|
||||
"signature": "a32872c9b926d7fd1fd2ed3aca63380a6c333c9ea05f1f84fd0248cd637f2553",
|
||||
"version": "175fcd16deaacf51dc467f7a07a12b3b7fe801252591d5a90131bdf66cc0bd96",
|
||||
"signature": "e3d849f4c3846c3254bf58e796a6ed29216735252657be3dec24d30c1df5517b",
|
||||
"affectsGlobalScope": false
|
||||
},
|
||||
"../src/bin/build-keycloak-theme/index.ts": {
|
||||
"version": "cf001b5b3246db48ec014aa295bbdcdf8d4134308f9bf5d9167c4ca0fb73296b",
|
||||
"version": "87c56909e792ee3afdc835081db05365537f1b2699945b7a8d59dcc896d30a78",
|
||||
"signature": "cc0e708e12dd472472902f20c879f10b9352d52e6823ac341bc0941ef15b9618",
|
||||
"affectsGlobalScope": false
|
||||
},
|
||||
|
Reference in New Issue
Block a user