diff --git a/src/login/UserProfileFormFields.tsx b/src/login/UserProfileFormFields.tsx index 445bda6f..93a99ad7 100644 --- a/src/login/UserProfileFormFields.tsx +++ b/src/login/UserProfileFormFields.tsx @@ -434,9 +434,7 @@ function AddRemoveButtonsMultiValuedAttribute(props: { } function InputTagSelects(props: InputFieldByTypeProps) { - const { attribute, dispatchFormAction, kcClsx, valueOrValues } = props; - - const { advancedMsg } = props.i18n; + const { attribute, dispatchFormAction, kcClsx, i18n, valueOrValues } = props; const { classDiv, classInput, classLabel, inputType } = (() => { const { inputType } = attribute.annotations; @@ -533,7 +531,7 @@ function InputTagSelects(props: InputFieldByTypeProps) { htmlFor={`${attribute.name}-${option}`} className={`${classLabel}${attribute.readOnly ? ` ${kcClsx("kcInputClassRadioCheckboxLabelDisabled")}` : ""}`} > - {advancedMsg(option)} + {inputLabel(i18n, attribute, option)} ))} @@ -580,8 +578,6 @@ 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 ( @@ -645,22 +641,26 @@ function SelectTag(props: InputFieldByTypeProps) { return options.map(option => ( )); })()} ); } + +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; +} diff --git a/stories/login/pages/Register.stories.tsx b/stories/login/pages/Register.stories.tsx index 0a8c395f..f25568cc 100644 --- a/stories/login/pages/Register.stories.tsx +++ b/stories/login/pages/Register.stories.tsx @@ -115,6 +115,38 @@ export const WithFavoritePet: Story = { ) }; + +export const WithNewsletter: Story = { + render: () => ( + + ) +}; + + export const WithEmailAsUsername: Story = { render: () => (