clarifiy checkbox

This commit is contained in:
Florian Scholdei
2019-06-12 16:27:16 +02:00
parent d50f6e0ec9
commit 5f435a524e
3 changed files with 29 additions and 22 deletions

View File

@@ -22,7 +22,6 @@ class Radio extends React.Component<Props> {
render() { render() {
return ( return (
<label className="radio" disabled={this.props.disabled}> <label className="radio" disabled={this.props.disabled}>
<input <input
type="radio" type="radio"

View File

@@ -116,14 +116,14 @@ class GroupForm extends React.Component<Props, State> {
} }
const iconType = group && group.external ? ( const iconType = group && group.external ? (
<Icon title={t("group.external")} name="sign-out-alt fa-rotate-270" /> <>{t("group.external")} <Icon title={t("group.external")} name="sign-out-alt fa-rotate-270" /></>
) : ( ) : (
<Icon title={t("group.internal")} name="sign-in-alt fa-rotate-90" /> <>{t("group.internal")} <Icon title={t("group.internal")} name="sign-in-alt fa-rotate-90" /></>
); );
return ( return (
<Checkbox <Checkbox
label={<>{iconType} {t("group.external")}</>} label={iconType}
checked={group.external} checked={group.external}
helpText={t("groupForm.help.externalHelpText")} helpText={t("groupForm.help.externalHelpText")}
onChange={this.handleExternalChange} onChange={this.handleExternalChange}

View File

@@ -17,6 +17,8 @@ type Props = {
submitForm: User => void, submitForm: User => void,
user?: User, user?: User,
loading?: boolean, loading?: boolean,
// context props
t: string => string t: string => string
}; };
@@ -138,10 +140,16 @@ class UserForm extends React.Component<Props, State> {
subtitle = <Subtitle subtitle={t("userForm.subtitle")} />; subtitle = <Subtitle subtitle={t("userForm.subtitle")} />;
} }
const iconType = user && user.active ? ( const iconType =
<Icon title={t("user.active")} name="user" /> user && user.active ? (
<>
{t("user.active")} <Icon title={t("user.active")} name="user" />
</>
) : ( ) : (
<>
{t("user.inactive")}{" "}
<Icon title={t("user.inactive")} name="user-slash" /> <Icon title={t("user.inactive")} name="user-slash" />
</>
); );
return ( return (
@@ -175,7 +183,7 @@ class UserForm extends React.Component<Props, State> {
<div className="column"> <div className="column">
{passwordChangeField} {passwordChangeField}
<Checkbox <Checkbox
label={<>{iconType} {t("user.active")}</>} label={iconType}
onChange={this.handleActiveChange} onChange={this.handleActiveChange}
checked={user ? user.active : false} checked={user ? user.active : false}
helpText={t("help.activeHelpText")} helpText={t("help.activeHelpText")}