mirror/keycloak
1
0
Fork 0
mirror of https://github.com/keycloak/keycloak.git synced 2026-02-08 16:28:54 -06:00
Code Issues Packages Projects Releases Wiki Activity

added 'x' to clear value and fix required * (#32572)

Browse Source 
fixes: #32546

Signed-off-by: Erik Jan de Wit <erikjan.dewit@gmail.com>
This commit is contained in:
Erik Jan de Wit
2024-09-03 20:17:00 +02:00
committed by GitHub
parent 44060c902e
commit d21327445d
3 changed files with 11 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
js/apps/admin-ui/src/components/dynamic/ClientSelectComponent.tsx
View File

@@ -2,6 +2,6 @@ import type { ComponentProps } from "./components";
import { ClientSelect } from "../client/ClientSelect";
import { convertToName } from "./DynamicComponents";
export const ClientSelectComponent = (props: ComponentProps) => {
return <ClientSelect {...props} name={convertToName(props.name!)} />;
};
export const ClientSelectComponent = (props: ComponentProps) => (
<ClientSelect {...props} name={convertToName(props.name!)} />
);

4
js/libs/ui-shared/src/controls/select-control/SingleSelectControl.tsx
View File

@@ -13,6 +13,7 @@ import {
FieldValues,
useFormContext,
} from "react-hook-form";
import { getRuleValue } from "../../utils/getRuleValue";
import { FormLabel } from "../FormLabel";
import {
SelectControlProps,
@@ -38,12 +39,13 @@ export const SingleSelectControl = <
formState: { errors },
} = useFormContext();
const [open, setOpen] = useState(false);
const required = getRuleValue(controller.rules?.required) === true;
return (
<FormLabel
name={name}
label={label}
isRequired={!!controller.rules?.required}
isRequired={required}
error={get(errors, name)}
labelIcon={labelIcon}
>

8
js/libs/ui-shared/src/controls/select-control/TypeaheadSelectControl.tsx
View File

@@ -21,6 +21,7 @@ import {
FieldValues,
useFormContext,
} from "react-hook-form";
import { getRuleValue } from "../../utils/getRuleValue";
import { FormLabel } from "../FormLabel";
import {
SelectControlOption,
@@ -57,6 +58,7 @@ export const TypeaheadSelectControl = <
const [filterValue, setFilterValue] = useState("");
const [focusedItemIndex, setFocusedItemIndex] = useState<number>(0);
const textInputRef = useRef<HTMLInputElement>();
const required = getRuleValue(controller.rules?.required) === true;
const filteredOptions = options.filter((option) =>
getValue(option).toLowerCase().startsWith(filterValue.toLowerCase()),
@@ -147,7 +149,7 @@ export const TypeaheadSelectControl = <
<FormLabel
name={name}
label={label}
isRequired={!!controller.rules?.required}
isRequired={required}
error={get(errors, name)}
labelIcon={labelIcon}
>
@@ -236,12 +238,12 @@ export const TypeaheadSelectControl = <
)}
</TextInputGroupMain>
<TextInputGroupUtilities>
{!!filterValue && (
{(!!filterValue || field.value) && (
<Button
variant="plain"
onClick={() => {
field.onChange(undefined);
setFilterValue("");
field.onChange("");
textInputRef?.current?.focus();
}}
aria-label="Clear input value"