keycloakify 10.0.0-rc.23 → 10.0.0-rc.24

package/src/login/UserProfileFormFields.tsx

@@ -1,6 +1,12 @@
 import { useEffect, useReducer, Fragment } from "react";
 import type { ClassKey } from "keycloakify/login/TemplateProps";
-import { useUserProfileForm, type KcContextLike, type FormAction, type FormFieldError } from "keycloakify/login/lib/useUserProfileForm";
+import {
+    useUserProfileForm,
+    getButtonToDisplayForMultivaluedAttributeField,
+    type KcContextLike,
+    type FormAction,
+    type FormFieldError
+} from "keycloakify/login/lib/useUserProfileForm";
 import type { Attribute } from "keycloakify/login/kcContext/KcContext";
 import { assert } from "tsafe/assert";
 import type { I18n } from "./i18n";
@@ -413,92 +419,34 @@ function AddRemoveButtonsMultiValuedAttribute(props: {
 
     const { msg } = i18n;
 
-    const hasRemove = (() => {
-        if (values.length === 1) {
-            return false;
-        }
-
-        const minCount = (() => {
-            const { multivalued } = attribute.validators;
-
-            if (multivalued === undefined) {
-                return undefined;
-            }
-
-            const minStr = multivalued.min;
-
-            if (minStr === undefined) {
-                return undefined;
-            }
-
-            return parseInt(`${minStr}`);
-        })();
-
-        if (minCount === undefined) {
-            return true;
-        }
-
-        if (values.length === minCount) {
-            return false;
-        }
-
-        return true;
-    })();
-
-    const hasAdd = (() => {
-        if (fieldIndex + 1 !== values.length) {
-            return false;
-        }
-
-        const maxCount = (() => {
-            const { multivalued } = attribute.validators;
-
-            if (multivalued === undefined) {
-                return undefined;
-            }
-
-            const maxStr = multivalued.max;
-
-            if (maxStr === undefined) {
-                return undefined;
-            }
+    const { hasAdd, hasRemove } = getButtonToDisplayForMultivaluedAttributeField({ attribute, values, fieldIndex });
 
-            return parseInt(`${maxStr}`);
-        })();
-
-        if (maxCount === undefined) {
-            return false;
-        }
-
-        if (values.length === maxCount) {
-            return false;
-        }
-
-        return true;
-    })();
+    const idPostfix = `-${attribute.name}-${fieldIndex + 1}`;
 
     return (
         <>
             {hasRemove && (
-                <button
-                    id={`kc-remove-${attribute.name}-${fieldIndex + 1}`}
-                    type="button"
-                    className="pf-c-button pf-m-inline pf-m-link"
-                    onClick={() =>
-                        dispatchFormAction({
-                            action: "update",
-                            name: attribute.name,
-                            valueOrValues: values.filter((_, i) => i !== fieldIndex)
-                        })
-                    }
-                >
-                    {msg("remove")}
-                    {hasRemove ? <>&nbsp;|&nbsp;</> : null}
-                </button>
+                <>
+                    <button
+                        id={`kc-remove${idPostfix}`}
+                        type="button"
+                        className="pf-c-button pf-m-inline pf-m-link"
+                        onClick={() =>
+                            dispatchFormAction({
+                                action: "update",
+                                name: attribute.name,
+                                valueOrValues: values.filter((_, i) => i !== fieldIndex)
+                            })
+                        }
+                    >
+                        {msg("remove")}
+                    </button>
+                    {hasAdd ? <>&nbsp;|&nbsp;</> : null}
+                </>
             )}
             {hasAdd && (
                 <button
-                    id="kc-add-titles-1"
+                    id={`kc-add${idPostfix}`}
                     type="button"
                     className="pf-c-button pf-m-inline pf-m-link"
                     onClick={() =>
@@ -580,7 +528,7 @@ function InputTagSelects(props: InputFiledByTypeProps) {
                         className={classInput}
                         aria-invalid={props.displayableErrors.length !== 0}
                         disabled={attribute.readOnly}
-                        checked={valueOrValues.includes(option)}
+                        checked={valueOrValues instanceof Array ? valueOrValues.includes(option) : valueOrValues === option}
                         onChange={event =>
                             formValidationDispatch({
                                 action: "update",

package/src/login/index.ts

@@ -3,9 +3,12 @@ import Fallback from "keycloakify/login/Fallback";
 export default Fallback;
 
 export { useDownloadTerms } from "keycloakify/login/lib/useDownloadTerms";
-export { getKcContext } from "keycloakify/login/kcContext/getKcContext";
-export { createGetKcContext } from "keycloakify/login/kcContext/createGetKcContext";
-export type { LoginThemePageId as PageId } from "keycloakify/bin/shared/constants";
 export { createUseI18n } from "keycloakify/login/i18n/i18n";
+export type {
+    ExtendKcContext,
+    Attribute,
+    PasswordPolicies
+} from "keycloakify/login/kcContext";
+export { createGetKcContextMock } from "keycloakify/login/kcContext";
 
 export type { PageProps } from "keycloakify/login/pages/PageProps";

package/src/login/kcContext/KcContext.ts

@@ -3,14 +3,28 @@ import type {
     LoginThemePageId,
     nameOfTheLocalizationRealmOverridesUserProfileProperty
 } from "keycloakify/bin/shared/constants";
+import type { ExtractAfterStartingWith } from "keycloakify/tools/ExtractAfterStartingWith";
+import type { ValueOf } from "keycloakify/tools/ValueOf";
 import { assert } from "tsafe/assert";
 import type { Equals } from "tsafe";
 import type { MessageKey } from "../i18n/i18n";
 
-type ExtractAfterStartingWith<
-    Prefix extends string,
-    StrEnum
-> = StrEnum extends `${Prefix}${infer U}` ? U : never;
+export type ExtendKcContext<
+    KcContextExtraProperties extends { properties?: Record<string, string | undefined> },
+    KcContextExtraPropertiesPerPage extends Record<string, Record<string, unknown>>
+> = ValueOf<{
+    [PageId in keyof KcContextExtraPropertiesPerPage | KcContext["pageId"]]: Extract<
+        KcContext,
+        { pageId: PageId }
+    > extends never
+        ? KcContext.Common &
+              KcContextExtraProperties & {
+                  pageId: PageId;
+              } & KcContextExtraPropertiesPerPage[PageId]
+        : Extract<KcContext, { pageId: PageId }> &
+              KcContextExtraProperties &
+              KcContextExtraPropertiesPerPage[PageId];
+}>;
 
 /** Take theses type definition with a grain of salt.
  * Some values might be undefined on some pages.
@@ -138,12 +152,12 @@ export declare namespace KcContext {
 
             getFirstError: (...fieldNames: string[]) => string;
         };
-        properties: Record<string, string | undefined>;
         authenticationSession?: {
             authSessionId: string;
             tabId: string;
             ssoLoginInOtherTabsUrl: string;
         };
+        properties: {};
         __localizationRealmOverridesUserProfile?: Record<string, string>;
     };
 
@@ -585,7 +599,7 @@ export declare namespace KcContext {
 }
 
 export type UserProfile = {
-    attributes: Attribute[];
+    attributesByName: Record<string, Attribute>;
     html5DataAnnotations?: Record<string, string>;
 };
 
@@ -683,31 +697,31 @@ export type Attribute = {
         | "photo";
 };
 
-export type Validators = Partial<{
-    length: Validators.DoIgnoreEmpty & Validators.Range;
-    integer: Validators.DoIgnoreEmpty & Validators.Range;
-    email: Validators.DoIgnoreEmpty;
-    pattern: Validators.DoIgnoreEmpty & Validators.ErrorMessage & { pattern: string };
-    options: Validators.Options;
-    multivalued: Validators.DoIgnoreEmpty & Validators.Range;
+export type Validators = {
+    length?: Validators.DoIgnoreEmpty & Validators.Range;
+    integer?: Validators.DoIgnoreEmpty & Validators.Range;
+    email?: Validators.DoIgnoreEmpty;
+    pattern?: Validators.DoIgnoreEmpty & Validators.ErrorMessage & { pattern: string };
+    options?: Validators.Options;
+    multivalued?: Validators.DoIgnoreEmpty & Validators.Range;
     // NOTE: Following are the validators for which we don't implement client side validation yet
     // or for which the validation can't be performed on the client side.
     /*
-    double: Validators.DoIgnoreEmpty & Validators.Range;
-    "up-immutable-attribute": {};
-    "up-attribute-required-by-metadata-value": {};
-    "up-username-has-value": {};
-    "up-duplicate-username": {};
-    "up-username-mutation": {};
-    "up-email-exists-as-username": {};
-    "up-blank-attribute-value": Validators.ErrorMessage & { "fail-on-null": boolean; };
-    "up-duplicate-email": {};
-    "local-date": Validators.DoIgnoreEmpty;
-    "person-name-prohibited-characters": Validators.DoIgnoreEmpty & Validators.ErrorMessage;
-    uri: Validators.DoIgnoreEmpty;
-    "username-prohibited-characters": Validators.DoIgnoreEmpty & Validators.ErrorMessage;
+    double?: Validators.DoIgnoreEmpty & Validators.Range;
+    "up-immutable-attribute"?: {};
+    "up-attribute-required-by-metadata-value"?: {};
+    "up-username-has-value"?: {};
+    "up-duplicate-username"?: {};
+    "up-username-mutation"?: {};
+    "up-email-exists-as-username"?: {};
+    "up-blank-attribute-value"?: Validators.ErrorMessage & { "fail-on-null": boolean; };
+    "up-duplicate-email"?: {};
+    "local-date"?: Validators.DoIgnoreEmpty;
+    "person-name-prohibited-characters"?: Validators.DoIgnoreEmpty & Validators.ErrorMessage;
+    uri?: Validators.DoIgnoreEmpty;
+    "username-prohibited-characters"?: Validators.DoIgnoreEmpty & Validators.ErrorMessage;
     */
-}>;
+};
 
 export declare namespace Validators {
     export type DoIgnoreEmpty = {

package/src/login/kcContext/getKcContextMock.ts

@@ -0,0 +1,80 @@
+import type { ExtendKcContext, KcContext as KcContextBase } from "./KcContext";
+import type { LoginThemePageId } from "keycloakify/bin/shared/constants";
+import type { DeepPartial } from "keycloakify/tools/DeepPartial";
+import { deepAssign } from "keycloakify/tools/deepAssign";
+import { structuredCloneButFunctions } from "keycloakify/tools/structuredCloneButFunctions";
+import { kcContextMocks, kcContextCommonMock } from "./kcContextMocks";
+import { exclude } from "tsafe/exclude";
+
+export function createGetKcContextMock<
+    KcContextExtraProperties extends { properties?: Record<string, string | undefined> },
+    KcContextExtraPropertiesPerPage extends Record<
+        `${string}.ftl`,
+        Record<string, unknown>
+    >
+>(params: {
+    kcContextExtraProperties: KcContextExtraProperties;
+    kcContextExtraPropertiesPerPage: KcContextExtraPropertiesPerPage;
+    overrides?: DeepPartial<KcContextExtraProperties & KcContextBase.Common>;
+    overridesPerPage?: {
+        [PageId in
+            | LoginThemePageId
+            | keyof KcContextExtraPropertiesPerPage]?: DeepPartial<
+            Extract<
+                ExtendKcContext<
+                    KcContextExtraProperties,
+                    KcContextExtraPropertiesPerPage
+                >,
+                { pageId: PageId }
+            >
+        >;
+    };
+}) {
+    const {
+        kcContextExtraProperties,
+        kcContextExtraPropertiesPerPage,
+        overrides: overrides_global,
+        overridesPerPage: overridesPerPage_global
+    } = params;
+
+    type KcContext = ExtendKcContext<
+        KcContextExtraProperties,
+        KcContextExtraPropertiesPerPage
+    >;
+
+    function getKcContextMock<
+        PageId extends LoginThemePageId | keyof KcContextExtraPropertiesPerPage
+    >(params: {
+        pageId: PageId;
+        overrides?: DeepPartial<Extract<KcContext, { pageId: PageId }>>;
+    }): Extract<KcContext, { pageId: PageId }> {
+        const { pageId, overrides } = params;
+
+        const kcContextMock = structuredCloneButFunctions(
+            kcContextMocks.find(kcContextMock => kcContextMock.pageId === pageId) ?? {
+                ...kcContextCommonMock,
+                pageId
+            }
+        );
+
+        [
+            kcContextExtraProperties,
+            kcContextExtraPropertiesPerPage[pageId],
+            overrides_global,
+            overridesPerPage_global?.[pageId],
+            overrides
+        ]
+            .filter(exclude(undefined))
+            .forEach(overrides =>
+                deepAssign({
+                    target: kcContextMock,
+                    source: overrides
+                })
+            );
+
+        // @ts-expect-error
+        return kcContextMock;
+    }
+
+    return { getKcContextMock };
+}

package/src/login/kcContext/index.ts

@@ -1 +1,7 @@
-export type { KcContext } from "./KcContext";
+export type {
+    ExtendKcContext,
+    KcContext,
+    Attribute,
+    PasswordPolicies
+} from "./KcContext";
+export { createGetKcContextMock } from "./getKcContextMock";

package/src/login/kcContext/kcContextMocks.ts

@@ -9,71 +9,72 @@ import { id } from "tsafe/id";
 import { assert, type Equals } from "tsafe/assert";
 import { BASE_URL } from "keycloakify/lib/BASE_URL";
 
-const attributes: Attribute[] = [
-    {
-        validators: {
-            length: {
-                "ignore.empty.value": true,
-                min: "3",
-                max: "255"
-            }
-        },
-        displayName: "${username}",
-        annotations: {},
-        required: true,
-        autocomplete: "username",
-        readOnly: false,
-        name: "username",
-        value: "xxxx"
-    },
-    {
-        validators: {
-            length: {
-                max: "255",
-                "ignore.empty.value": true
-            },
-            email: {
-                "ignore.empty.value": true
+const attributesByName = Object.fromEntries(
+    id<Attribute[]>([
+        {
+            validators: {
+                length: {
+                    "ignore.empty.value": true,
+                    min: "3",
+                    max: "255"
+                }
             },
-            pattern: {
-                "ignore.empty.value": true,
-                pattern: "gmail\\.com$"
-            }
+            displayName: "${username}",
+            annotations: {},
+            required: true,
+            autocomplete: "username",
+            readOnly: false,
+            name: "username"
         },
-        displayName: "${email}",
-        annotations: {},
-        required: true,
-        autocomplete: "email",
-        readOnly: false,
-        name: "email"
-    },
-    {
-        validators: {
-            length: {
-                max: "255",
-                "ignore.empty.value": true
-            }
+        {
+            validators: {
+                length: {
+                    max: "255",
+                    "ignore.empty.value": true
+                },
+                email: {
+                    "ignore.empty.value": true
+                },
+                pattern: {
+                    "ignore.empty.value": true,
+                    pattern: "gmail\\.com$"
+                }
+            },
+            displayName: "${email}",
+            annotations: {},
+            required: true,
+            autocomplete: "email",
+            readOnly: false,
+            name: "email"
         },
-        displayName: "${firstName}",
-        annotations: {},
-        required: true,
-        readOnly: false,
-        name: "firstName"
-    },
-    {
-        validators: {
-            length: {
-                max: "255",
-                "ignore.empty.value": true
-            }
+        {
+            validators: {
+                length: {
+                    max: "255",
+                    "ignore.empty.value": true
+                }
+            },
+            displayName: "${firstName}",
+            annotations: {},
+            required: true,
+            readOnly: false,
+            name: "firstName"
         },
-        displayName: "${lastName}",
-        annotations: {},
-        required: true,
-        readOnly: false,
-        name: "lastName"
-    }
-];
+        {
+            validators: {
+                length: {
+                    max: "255",
+                    "ignore.empty.value": true
+                }
+            },
+            displayName: "${lastName}",
+            annotations: {},
+            required: true,
+            readOnly: false,
+            name: "lastName"
+        }
+    ]).map(attribute => [attribute.name, attribute])
+);
 
 const resourcesPath = `${BASE_URL}${keycloak_resources}/login/resources`;
 
@@ -112,98 +113,34 @@ export const kcContextCommonMock: KcContext.Common = {
     locale: {
         supported: [
             /* spell-checker: disable */
-            {
-                url: "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=de",
-                label: "Deutsch",
-                languageTag: "de"
-            },
-            {
-                url: "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=no",
-                label: "Norsk",
-                languageTag: "no"
-            },
-            {
-                url: "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=ru",
-                label: "Русский",
-                languageTag: "ru"
-            },
-            {
-                url: "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=sv",
-                label: "Svenska",
-                languageTag: "sv"
-            },
-            {
-                url: "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=pt-BR",
-                label: "Português (Brasil)",
-                languageTag: "pt-BR"
-            },
-            {
-                url: "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=lt",
-                label: "Lietuvių",
-                languageTag: "lt"
-            },
-            {
-                url: "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=en",
-                label: "English",
-                languageTag: "en"
-            },
-            {
-                url: "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=it",
-                label: "Italiano",
-                languageTag: "it"
-            },
-            {
-                url: "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=fr",
-                label: "Français",
-                languageTag: "fr"
-            },
-            {
-                url: "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=zh-CN",
-                label: "中文简体",
-                languageTag: "zh-CN"
-            },
-            {
-                url: "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=es",
-                label: "Español",
-                languageTag: "es"
-            },
-            {
-                url: "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=cs",
-                label: "Čeština",
-                languageTag: "cs"
-            },
-            {
-                url: "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=ja",
-                label: "日本語",
-                languageTag: "ja"
-            },
-            {
-                url: "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=sk",
-                label: "Slovenčina",
-                languageTag: "sk"
-            },
-            {
-                url: "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=pl",
-                label: "Polski",
-                languageTag: "pl"
-            },
-            {
-                url: "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=ca",
-                label: "Català",
-                languageTag: "ca"
-            },
-            {
-                url: "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=nl",
-                label: "Nederlands",
-                languageTag: "nl"
-            },
-            {
-                url: "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=tr",
-                label: "Türkçe",
-                languageTag: "tr"
-            }
+            ["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"
     },
     auth: {
@@ -265,7 +202,7 @@ export const kcContextMocks = [
         recaptchaRequired: false,
         pageId: "register.ftl",
         profile: {
-            attributes
+            attributesByName
         },
         scripts: [
             //"https://www.google.com/recaptcha/api.js"
@@ -416,7 +353,7 @@ export const kcContextMocks = [
         ...kcContextCommonMock,
         pageId: "login-update-profile.ftl",
         profile: {
-            attributes
+            attributesByName
         }
     }),
     id<KcContext.LoginIdpLinkConfirm>({
@@ -472,14 +409,16 @@ export const kcContextMocks = [
         ...kcContextCommonMock,
         pageId: "idp-review-user-profile.ftl",
         profile: {
-            attributes
+            attributesByName
         }
     }),
     id<KcContext.UpdateEmail>({
         ...kcContextCommonMock,
         pageId: "update-email.ftl",
         profile: {
-            attributes: attributes.filter(attribute => attribute.name === "email")
+            attributesByName: {
+                email: attributesByName["email"]
+            }
         }
     }),
     id<KcContext.SelectAuthenticator>({