added "on" label to checkbox (#28087)
Signed-off-by: Erik Jan de Wit <erikjan.dewit@gmail.com>
This commit is contained in:
parent
635481a98d
commit
adf838f81f
3 changed files with 18 additions and 5 deletions
|
@ -1,8 +1,12 @@
|
|||
import { Checkbox, Radio } from "@patternfly/react-core";
|
||||
import { Controller } from "react-hook-form";
|
||||
import { Options, UserProfileFieldProps } from "./UserProfileFields";
|
||||
import {
|
||||
OptionLabel,
|
||||
Options,
|
||||
UserProfileFieldProps,
|
||||
} from "./UserProfileFields";
|
||||
import { UserProfileGroup } from "./UserProfileGroup";
|
||||
import { fieldName, isRequiredAttribute } from "./utils";
|
||||
import { fieldName, isRequiredAttribute, unWrap } from "./utils";
|
||||
|
||||
export const OptionComponent = (props: UserProfileFieldProps) => {
|
||||
const { form, inputType, attribute } = props;
|
||||
|
@ -12,6 +16,10 @@ export const OptionComponent = (props: UserProfileFieldProps) => {
|
|||
const options =
|
||||
(attribute.validators?.options as Options | undefined)?.options || [];
|
||||
|
||||
const optionLabel = attribute.annotations?.[
|
||||
"inputOptionLabels"
|
||||
] as OptionLabel;
|
||||
|
||||
return (
|
||||
<UserProfileGroup {...props}>
|
||||
<Controller
|
||||
|
@ -25,7 +33,7 @@ export const OptionComponent = (props: UserProfileFieldProps) => {
|
|||
key={option}
|
||||
id={option}
|
||||
data-testid={option}
|
||||
label={option}
|
||||
label={props.t(unWrap(optionLabel?.on || option))}
|
||||
value={option}
|
||||
isChecked={field.value.includes(option)}
|
||||
onChange={() => {
|
||||
|
|
|
@ -1,7 +1,11 @@
|
|||
import { Select, SelectOption } from "@patternfly/react-core";
|
||||
import { useState } from "react";
|
||||
import { Controller, ControllerRenderProps } from "react-hook-form";
|
||||
import { Options, UserProfileFieldProps } from "./UserProfileFields";
|
||||
import {
|
||||
OptionLabel,
|
||||
Options,
|
||||
UserProfileFieldProps,
|
||||
} from "./UserProfileFields";
|
||||
import { UserProfileGroup } from "./UserProfileGroup";
|
||||
import {
|
||||
UserFormFields,
|
||||
|
@ -10,7 +14,6 @@ import {
|
|||
unWrap,
|
||||
} from "./utils";
|
||||
|
||||
type OptionLabel = Record<string, string> | undefined;
|
||||
export const SelectComponent = (props: UserProfileFieldProps) => {
|
||||
const { t, form, inputType, attribute } = props;
|
||||
const [open, setOpen] = useState(false);
|
||||
|
|
|
@ -54,6 +54,8 @@ export type UserProfileFieldProps = {
|
|||
renderer?: (attribute: UserProfileAttributeMetadata) => ReactNode;
|
||||
};
|
||||
|
||||
export type OptionLabel = Record<string, string> | undefined;
|
||||
|
||||
export const FIELDS: {
|
||||
[type in InputType]: (props: UserProfileFieldProps) => JSX.Element;
|
||||
} = {
|
||||
|
|
Loading…
Reference in a new issue