libre.sh/keycloak-scim
4
0
Fork 0
Code Issues 15 Pull requests Releases 1 Activity Actions

added default field type (#24172)

Browse source 
* added default field type

default will now render a multiline input
which makes more sense then a multi select
with no options

fixes: #23911

* changed to only render multi line when needed
This commit is contained in:
Erik Jan de Wit 2023-10-20 19:07:55 +02:00 committed by GitHub
parent 1837b4401c
commit bafc6da6b2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 29 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
js/apps/admin-ui/src/user/UserProfileFields.tsx
View file

@ -15,6 +15,7 @@ import { TextAreaComponent } from "./components/TextAreaComponent";
import { TextComponent } from "./components/TextComponent";
import { UserFormFields } from "./form-state";
import { fieldName, isRootAttribute } from "./utils";
import { MultiInputComponent } from "./components/MultiInputComponent";
export type UserProfileError = {
responseData: { errors?: { errorMessage: string }[] };
@ -50,6 +51,7 @@ const INPUT_TYPES = [
"html5-date",
"html5-month",
"html5-time",
"multi-input",
] as const;
export type InputType = (typeof INPUT_TYPES)[number];
@ -79,6 +81,7 @@ export const FIELDS: {
"html5-date": TextComponent,
"html5-month": TextComponent,
"html5-time": TextComponent,
"multi-input": MultiInputComponent,
} as const;
export type UserProfileFieldsProps = {
@ -179,7 +182,7 @@ const FormField = ({ form, attribute, roles }: FormFieldProps) => {
);
};
const DEFAULT_INPUT_TYPE = "multiselect" satisfies InputType;
const DEFAULT_INPUT_TYPE = "text" satisfies InputType;
function determineInputType(
attribute: UserProfileAttributeMetadata,
@ -199,7 +202,7 @@ function determineInputType(
// An attribute with multiple values is always multi-valued, even if an input type is provided.
if (Array.isArray(value) && value.length > 1) {
return DEFAULT_INPUT_TYPE;
return "multi-input";
}
return inputType;

24
js/apps/admin-ui/src/user/components/MultiInputComponent.tsx Normal file
View file

@ -0,0 +1,24 @@
import { useTranslation } from "react-i18next";
import { MultiLineInput } from "../../components/multi-line-input/MultiLineInput";
import { UserProfileFieldProps } from "../UserProfileFields";
import { fieldName, label } from "../utils";
import { UserProfileGroup } from "./UserProfileGroup";
export const MultiInputComponent = ({
form,
attribute,
}: UserProfileFieldProps) => {
const { t } = useTranslation();
return (
<UserProfileGroup form={form} attribute={attribute}>
<MultiLineInput
aria-label={label(attribute, t)}
name={fieldName(attribute)!}
addButtonLabel={t("addMultivaluedLabel", {
fieldLabel: label(attribute, t),
})}
/>
</UserProfileGroup>
);
};