keycloakify 10.0.0-rc.2 → 10.0.0-rc.3

package/src/login/Template.tsx

@@ -32,7 +32,7 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
 
     const { getClassName } = useGetClassName({ doUseDefaultCss, classes });
 
-    const { msg, msgStr, changeLocale, labelBySupportedLanguageTag, currentLanguageTag } = i18n;
+    const { msg, msgStr, getChangeLocalUrl, labelBySupportedLanguageTag, currentLanguageTag } = i18n;
 
     const { realm, locale, auth, url, message, isAppInitiatedAction, authenticationSession, scripts } = kcContext;
 
@@ -126,31 +126,17 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
 
             <div className={getClassName("kcFormCardClass")}>
                 <header className={getClassName("kcFormHeaderClass")}>
-                    {realm.internationalizationEnabled && (assert(locale !== undefined), true) && locale.supported.length > 1 && (
+                    {realm.internationalizationEnabled && (assert(locale !== undefined), locale.supported.length > 1) && (
                         <div className={getClassName("kcLocaleMainClass")} id="kc-locale">
                             <div id="kc-locale-wrapper" className={getClassName("kcLocaleWrapperClass")}>
                                 <div id="kc-locale-dropdown" className={clsx("menu-button-links", getClassName("kcLocaleDropDownClass"))}>
                                     {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
-                                    <a href="#" id="kc-current-locale-link">
-                                        {labelBySupportedLanguageTag[currentLanguageTag]}
-                                    </a>
-                                    <ul>
-                                        {locale.supported.map(({ languageTag }) => (
-                                            <li key={languageTag} className="kc-dropdown-item">
-                                                {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
-                                                <a href="#" onClick={() => changeLocale(languageTag)}>
-                                                    {labelBySupportedLanguageTag[languageTag]}
-                                                </a>
-                                            </li>
-                                        ))}
-                                    </ul>
-
                                     <button
                                         tabIndex={1}
                                         id="kc-current-locale-link"
                                         aria-label={msgStr("languages" as any)}
-                                        aria-haspopup={true}
-                                        aria-expanded={false}
+                                        aria-haspopup="true"
+                                        aria-expanded="false"
                                         aria-controls="language-switch1"
                                     >
                                         {labelBySupportedLanguageTag[currentLanguageTag]}
@@ -165,13 +151,11 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
                                     >
                                         {locale.supported.map(({ languageTag }, i) => (
                                             <li key={languageTag} className={getClassName("kcLocaleListItemClass")} role="none">
-                                                {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
                                                 <a
                                                     role="menuitem"
-                                                    id={`language-${i}`}
+                                                    id={`language-${i + 1}`}
                                                     className={getClassName("kcLocaleItemClass")}
-                                                    href="#"
-                                                    onClick={() => changeLocale(languageTag)}
+                                                    href={getChangeLocalUrl(languageTag)}
                                                 >
                                                     {labelBySupportedLanguageTag[languageTag]}
                                                 </a>

package/src/login/i18n/i18n.tsx

@@ -28,11 +28,10 @@ export type GenericI18n<MessageKey extends string> = {
      */
     currentLanguageTag: string;
     /**
-     * To call when the user switch language.
-     * This will cause the page to be reloaded,
-     * on next load currentLanguageTag === newLanguageTag
+     * Redirect to this url to change the language.
+     * After reload currentLanguageTag === newLanguageTag
      */
-    changeLocale: (newLanguageTag: string) => never;
+    getChangeLocalUrl: (newLanguageTag: string) => string;
     /**
      * e.g. "en" => "English", "fr" => "Français", ...
      *
@@ -104,7 +103,7 @@ export function createUseI18n<ExtraMessageKey extends string = never>(extraMessa
                         } as any
                     }),
                     currentLanguageTag,
-                    "changeLocale": newLanguageTag => {
+                    "getChangeLocalUrl": newLanguageTag => {
                         const { locale } = kcContext;
 
                         assert(locale !== undefined, "Internationalization not enabled");
@@ -113,9 +112,7 @@ export function createUseI18n<ExtraMessageKey extends string = never>(extraMessa
 
                         assert(targetSupportedLocale !== undefined, `${newLanguageTag} need to be enabled in Keycloak admin`);
 
-                        window.location.href = targetSupportedLocale.url;
-
-                        assert(false, "never");
+                        return targetSupportedLocale.url;
                     },
                     "labelBySupportedLanguageTag": Object.fromEntries(
                         (kcContext.locale?.supported ?? []).map(({ languageTag, label }) => [languageTag, label])

package/src/login/pages/Code.tsx

@@ -24,7 +24,7 @@ export default function Code(props: PageProps<Extract<KcContext, { pageId: "code
                 {code.success ? (
                     <>
                         <p>{msg("copyCodeInstruction")}</p>
-                        <input id="code" className={getClassName("kcTextareaClass")} value={code.code} />
+                        <input id="code" className={getClassName("kcTextareaClass")} defaultValue={code.code} />
                     </>
                 ) : (
                     <p id="error">{code.error}</p>

package/src/login/pages/IdpReviewUserProfile.tsx

@@ -29,7 +29,7 @@ export default function IdpReviewUserProfile(props: IdpReviewUserProfileProps) {
         <Template
             {...{ kcContext, i18n, doUseDefaultCss, classes }}
             displayMessage={messagesPerField.exists("global")}
-            displayRequiredFields={true}
+            displayRequiredFields
             headerNode={msg("loginIdpReviewProfileTitle")}
         >
             <form id="kc-idp-review-profile-form" className={getClassName("kcFormClass")} action={url.loginAction} method="post">

package/src/login/pages/Login.tsx

@@ -104,7 +104,7 @@ export default function Login(props: PageProps<Extract<KcContext, { pageId: "log
                                         id="username"
                                         className={getClassName("kcInputClass")}
                                         name="username"
-                                        value={login.username ?? ""}
+                                        defaultValue={login.username ?? ""}
                                         type="text"
                                         autoFocus
                                         autoComplete="username"

package/src/login/pages/LoginUpdateProfile.tsx

@@ -26,7 +26,7 @@ export default function LoginUpdateProfile(props: LoginUpdateProfileProps) {
     const [isFormSubmittable, setIsFormSubmittable] = useState(false);
 
     return (
-        <Template {...{ kcContext, i18n, doUseDefaultCss, classes }} headerNode={msg("loginProfileTitle")}>
+        <Template {...{ kcContext, i18n, doUseDefaultCss, classes }} displayRequiredFields headerNode={msg("loginProfileTitle")}>
             <form id="kc-update-profile-form" className={getClassName("kcFormClass")} action={url.loginAction} method="post">
                 <UserProfileFormFields
                     {...{

package/src/login/pages/LoginUsername.tsx

@@ -101,7 +101,7 @@ export default function LoginUsername(props: PageProps<Extract<KcContext, { page
                                         id="username"
                                         className={getClassName("kcInputClass")}
                                         name="username"
-                                        value={login.username ?? ""}
+                                        defaultValue={login.username ?? ""}
                                         type="text"
                                         autoFocus
                                         autoComplete="off"

package/src/login/pages/Register.tsx

@@ -28,7 +28,7 @@ export default function Register(props: RegisterProps) {
     const [isFormSubmittable, setIsFormSubmittable] = useState(false);
 
     return (
-        <Template {...{ kcContext, i18n, doUseDefaultCss, classes }} headerNode={msg("registerTitle")}>
+        <Template {...{ kcContext, i18n, doUseDefaultCss, classes }} headerNode={msg("registerTitle")} displayRequiredFields>
             <form id="kc-register-form" className={getClassName("kcFormClass")} action={url.registrationAction} method="post">
                 <UserProfileFormFields
                     {...{

package/src/login/pages/UpdateEmail.tsx

@@ -29,7 +29,7 @@ export default function UpdateEmail(props: UpdateEmailProps) {
         <Template
             {...{ kcContext, i18n, doUseDefaultCss, classes }}
             displayMessage={messagesPerField.exists("global")}
-            displayRequiredFields={true}
+            displayRequiredFields
             headerNode={msg("updateEmailTitle")}
         >
             <form id="kc-update-email-form" className={getClassName("kcFormClass")} action={url.loginAction} method="post">

package/src/login/pages/WebauthnRegister.tsx

@@ -275,7 +275,7 @@ function LogoutOtherSessions(props: { i18n: I18n; getClassName: ReturnType<typeo
             <div className={getClassName("kcFormOptionsWrapperClass")}>
                 <div className="checkbox">
                     <label>
-                        <input type="checkbox" id="logout-sessions" name="logout-sessions" value="on" checked />
+                        <input type="checkbox" id="logout-sessions" name="logout-sessions" value="on" defaultChecked={true} />
                         {msg("logoutOtherSessions")}
                     </label>
                 </div>

package/bin/tools/grant-exec-perms.d.ts

@@ -1 +0,0 @@
-export {};

package/bin/tools/grant-exec-perms.js

@@ -1,100 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (g && (g = 0, op[0] && (_ = 0)), _) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var getThisCodebaseRootDirPath_1 = require("./getThisCodebaseRootDirPath");
-var path_1 = require("path");
-var fs_1 = require("fs");
-var promises_1 = require("fs/promises");
-(function () { return __awaiter(void 0, void 0, void 0, function () {
-    var thisCodebaseRootDirPath, bin, promises;
-    return __generator(this, function (_a) {
-        var _b;
-        switch (_a.label) {
-            case 0:
-                thisCodebaseRootDirPath = (0, getThisCodebaseRootDirPath_1.getThisCodebaseRootDirPath)();
-                return [4 /*yield*/, (_b = (0, path_1.join)(thisCodebaseRootDirPath, "package.json"), Promise.resolve().then(function () { return __importStar(require(_b)); }))];
-            case 1:
-                bin = (_a.sent()).bin;
-                promises = Object.values(bin).map(function (scriptPath) { return __awaiter(void 0, void 0, void 0, function () {
-                    var fullPath, oldMode, newMode;
-                    return __generator(this, function (_a) {
-                        switch (_a.label) {
-                            case 0:
-                                fullPath = (0, path_1.join)(thisCodebaseRootDirPath, scriptPath);
-                                return [4 /*yield*/, (0, promises_1.stat)(fullPath)];
-                            case 1:
-                                oldMode = (_a.sent()).mode;
-                                newMode = oldMode | fs_1.constants.S_IXUSR | fs_1.constants.S_IXGRP | fs_1.constants.S_IXOTH;
-                                return [4 /*yield*/, (0, promises_1.chmod)(fullPath, newMode)];
-                            case 2:
-                                _a.sent();
-                                return [2 /*return*/];
-                        }
-                    });
-                }); });
-                return [4 /*yield*/, Promise.all(promises)];
-            case 2:
-                _a.sent();
-                return [2 /*return*/];
-        }
-    });
-}); })();
-//# sourceMappingURL=grant-exec-perms.js.map

package/bin/tools/grant-exec-perms.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"grant-exec-perms.js","sourceRoot":"","sources":["../../src/bin/tools/grant-exec-perms.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2EAA0E;AAC1E,6BAAwC;AACxC,yBAA+B;AAC/B,wCAA0C;AAE1C,CAAC;;;;;;gBACS,uBAAuB,GAAG,IAAA,uDAA0B,GAAE,CAAC;gBAE7C,2BAAa,IAAA,WAAQ,EAAC,uBAAuB,EAAE,cAAc,CAAC,8EAAC;;gBAAvE,GAAG,GAAK,CAAA,SAA+D,CAAA,IAApE;gBAEL,QAAQ,GAAG,MAAM,CAAC,MAAM,CAAS,GAAG,CAAC,CAAC,GAAG,CAAC,UAAM,UAAU;;;;;gCACtD,QAAQ,GAAG,IAAA,WAAQ,EAAC,uBAAuB,EAAE,UAAU,CAAC,CAAC;gCAC9C,qBAAM,IAAA,eAAI,EAAC,QAAQ,CAAC,EAAA;;gCAA/B,OAAO,GAAG,CAAC,SAAoB,CAAC,CAAC,IAAI;gCACrC,OAAO,GAAG,OAAO,GAAG,cAAS,CAAC,OAAO,GAAG,cAAS,CAAC,OAAO,GAAG,cAAS,CAAC,OAAO,CAAC;gCACpF,qBAAM,IAAA,gBAAK,EAAC,QAAQ,EAAE,OAAO,CAAC,EAAA;;gCAA9B,SAA8B,CAAC;;;;qBAClC,CAAC,CAAC;gBAEH,qBAAM,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAA;;gBAA3B,SAA2B,CAAC;;;;KAC/B,CAAC,EAAE,CAAC"}

package/src/bin/tools/grant-exec-perms.ts

@@ -1,19 +0,0 @@
-import { getThisCodebaseRootDirPath } from "./getThisCodebaseRootDirPath";
-import { join as pathJoin } from "path";
-import { constants } from "fs";
-import { chmod, stat } from "fs/promises";
-
-(async () => {
-    const thisCodebaseRootDirPath = getThisCodebaseRootDirPath();
-
-    const { bin } = await import(pathJoin(thisCodebaseRootDirPath, "package.json"));
-
-    const promises = Object.values<string>(bin).map(async scriptPath => {
-        const fullPath = pathJoin(thisCodebaseRootDirPath, scriptPath);
-        const oldMode = (await stat(fullPath)).mode;
-        const newMode = oldMode | constants.S_IXUSR | constants.S_IXGRP | constants.S_IXOTH;
-        await chmod(fullPath, newMode);
-    });
-
-    await Promise.all(promises);
-})();