Commit 89ac6677 authored by Viacheslav Pavlov's avatar Viacheslav Pavlov Committed by Matija Obreza

Please include role definitions

- most of Radio field replaced with generic RadioSelection
- added generic CheckboxSelection
parent 62031fc7
Pipeline #7564 passed with stages
in 4 minutes and 10 seconds
......@@ -591,6 +591,12 @@
"DIGITIZER": "Data digitizer",
"CURATOR": "Data curator",
"null": "Not specified"
},
"roledesc": {
"MANAGER": "Responsible of the planning and execution of the germplasm characterization and evaluation activity which resulted in the dataset.\n Oversees the collection and management of characterization and evaluation data, and has final sign-off on publication.",
"COLLECTOR": "Records germplasm characterization or evaluation data in the field.",
"DIGITIZER": "Digitizes data.",
"CURATOR": "Organizes and validates data and metadata in correct format, ensures quality of both."
}
}
},
......@@ -603,6 +609,9 @@
"label": "Dataset title",
"placeholder": "Name given to the dataset (e.g., Characterization of maize accessions in Kenya)"
},
"rights": {
"label": "Rights"
},
"partner": {
"label": "Select Data provider",
"placeholder": "Data provider"
......
import * as React from 'react';
import { connect } from 'react-redux';
import { translate } from 'react-i18next';
import Grid from '@material-ui/core/Grid';
import FormControlLabel from '@material-ui/core/FormControlLabel';
import FormLabel from '@material-ui/core/FormLabel';
import FormControl from '@material-ui/core/FormControl';
import FormHelperText from '@material-ui/core/FormHelperText';
import Checkbox from '@material-ui/core/Checkbox';
import Radio from '@material-ui/core/Radio';
import Crop from 'model/genesys/Crop';
interface ICropSelectorProps extends React.ClassAttributes<any> {
t: any;
crops: Crop[];
fields?: any;
label: string;
input?: any;
single?: boolean;
}
const handleCheckboxChange = (fields, code) => () => {
const index = fields.getAll() ? fields.getAll().indexOf(code) : -1;
if (index === -1) {
fields.push(code);
} else {
fields.remove(index);
}
};
const handleRadioButtonChange = (input, code) => () => {
input.onChange(code);
};
const renderCheckbox = (fields, code) => (
<Checkbox
checked={ fields.getAll() && fields.getAll().indexOf(code) !== -1 }
onChange={ handleCheckboxChange(fields, code) }
value={ code }
/>
);
const renderRadioButton = (input, code) => (
<Radio
checked={ input.value === code }
onChange={ handleRadioButtonChange(input, code) }
value={ code }
/>
);
const CropSelector = ({t, crops, label, single, fields, input}: ICropSelectorProps) => crops && (
<FormControl fullWidth>
<FormLabel>{ label }</FormLabel>
<FormHelperText>{ t('crop.public.c.cropSelector.helper') }</FormHelperText>
<Grid container>
{
crops.sort((a, b) => a.name.localeCompare(b.name)).map((crop: Crop) => (
<Grid item key={ crop.shortName } xs={ 6 } md={ 4 } lg={ 3 } xl={ 2 }>
<FormControlLabel
control={
single ? renderRadioButton(input, crop.shortName)
: renderCheckbox(fields, crop.shortName)
}
label={ crop.name }
/>
</Grid>
))
}
</Grid>
</FormControl>
);
const mapStateToProps = (state) => ({
crops: state.crop.list,
});
export default connect(mapStateToProps, null)(translate()(CropSelector));
......@@ -11,6 +11,12 @@
"DIGITIZER": "Data digitizer",
"CURATOR": "Data curator",
"null": "Not specified"
},
"roledesc": {
"MANAGER": "Responsible of the planning and execution of the germplasm characterization and evaluation activity which resulted in the dataset.\n Oversees the collection and management of characterization and evaluation data, and has final sign-off on publication.",
"COLLECTOR": "Records germplasm characterization or evaluation data in the field.",
"DIGITIZER": "Digitizes data.",
"CURATOR": "Organizes and validates data and metadata in correct format, ensures quality of both."
}
}
},
......@@ -23,6 +29,9 @@
"label": "Dataset title",
"placeholder": "Name given to the dataset (e.g., Characterization of maize accessions in Kenya)"
},
"rights": {
"label": "Rights"
},
"partner": {
"label": "Select Data provider",
"placeholder": "Data provider"
......
......@@ -4,30 +4,43 @@ import { translate } from 'react-i18next';
import {DATASET_BASIC_INFO_FORM} from 'datasets/constants';
import { AVAILABLE_LICENSES } from 'model/License';
import Crop from 'model/genesys/Crop';
import {TextField} from 'ui/common/text-field';
import {MarkdownField} from 'ui/catalog/markdown';
import SelectPartner from 'partners/ui/c/SelectPartner';
import CropSelector from 'crops/ui/c/CropSelector';
import Validators from 'utilities/Validators';
import BasicInfoRadioGroup from './LicenceSelector';
import remoteSubmit from './RemoteSubmit';
import VocabularyTermPicker from 'vocabulary/ui/c/VocabularyTermPicker';
import RadioSelection from 'ui/common/forms/RadioSelection';
import { ExternalLink } from 'ui/catalog/Links';
import CheckboxSelection from 'ui/common/forms/CheckboxSelection';
interface ILoginContainerProps extends React.ClassAttributes<any> {
handleSubmit: () => void;
initialValues: any;
classes: any;
crops: Crop[];
uuid: string;
t: any;
}
const renderLicenseLabel = (license) => (
<div><b>{ license.code }</b> { license.title }
{ license.url &&
<div><ExternalLink link={ license.url }>{ license.url }</ExternalLink></div>
}
</div>
);
class BasicInfoStep extends React.Component<ILoginContainerProps, any> {
public render() {
const {initialValues, handleSubmit, t} = this.props;
const {initialValues, crops, handleSubmit, t} = this.props;
return (
<form onSubmit={ handleSubmit } className="p-20 m-20 even-row">
......@@ -70,7 +83,12 @@ class BasicInfoStep extends React.Component<ILoginContainerProps, any> {
/>
<Field
name="rights"
component={ BasicInfoRadioGroup }
component={ RadioSelection }
formLabel={ t('datasets.dashboard.p.stepper.basicInfo.rights.label') }
options={ AVAILABLE_LICENSES }
valueField="code"
renderOptionLabel={ renderLicenseLabel }
singleColumn
/>
<Field
name="language"
......@@ -88,8 +106,11 @@ class BasicInfoStep extends React.Component<ILoginContainerProps, any> {
/>
<FieldArray
name="crops"
component={ CropSelector }
label={ t('datasets.dashboard.p.stepper.basicInfo.crops.label') }
component={ CheckboxSelection }
options={ crops }
valueField="shortName"
renderOptionLabel={ (crop) => crop.name }
formLabel={ t('datasets.dashboard.p.stepper.basicInfo.crops.label') }
/>
</form>
);
......
import * as React from 'react';
import FormControlLabel from '@material-ui/core/FormControlLabel';
import FormLabel from '@material-ui/core/FormLabel';
import FormControl from '@material-ui/core/FormControl';
import Radio from '@material-ui/core/Radio';
import RadioGroup from '@material-ui/core/RadioGroup';
import { withStyles } from '@material-ui/core/styles';
import { AVAILABLE_LICENSES } from 'model/License';
import { ExternalLink } from 'ui/catalog/Links';
const styles = {
// None
};
const LicenceSelector = ({input, meta, classes, ...rest}) => (
<FormControl required>
<FormLabel>Rights</FormLabel>
<RadioGroup
{ ...input }
{ ...rest }
value={ input.value }
onChange={
(event, value) => input.onChange(value) // tslint:disable-line
}
>
{
AVAILABLE_LICENSES.map((license) => (
<FormControlLabel
key={ license.code }
value={ license.code }
label={ (
<div><b>{ license.code }</b> { license.title }
{ license.url &&
<div><ExternalLink link={ license.url }>{ license.url }</ExternalLink></div>
}
</div>
) }
control={ <Radio/> }
/>
))
}
</RadioGroup>
</FormControl>
);
export default withStyles(styles)(LicenceSelector);
......@@ -7,6 +7,7 @@ import BasicInfoForm from './BasicInfoForm';
import Dataset from 'model/catalog/Dataset';
import {loadMyPartners} from 'partners/actions/dashboard';
import { listCrops } from 'actions/crop';
import Partner from 'model/genesys/Partner';
import Crop from 'model/genesys/Crop';
import {submit, isInvalid} from 'redux-form';
......@@ -19,6 +20,7 @@ interface IDatasetProps extends React.ClassAttributes<any> {
dataset: Dataset;
saveDataset: (dataset: Dataset) => Promise<Dataset>;
listCrops: any;
loadMyPartners: any;
myPartners: Partner[];
crops: Crop[];
......@@ -38,12 +40,14 @@ class BasicInfoStep extends React.Component<IDatasetProps, any> {
];
public componentWillMount() {
const {myPartners, loadMyPartners} = this.props;
const {myPartners, loadMyPartners, crops, listCrops} = this.props;
if (!myPartners || myPartners.length === 0) {
loadMyPartners();
}
}
if (! crops || crops.length === 0) {
listCrops(true);
}
}
protected gotoStep = (id) => () => {
const { submit, onGotoStep } = this.props;
......@@ -53,7 +57,7 @@ class BasicInfoStep extends React.Component<IDatasetProps, any> {
}
public render() {
const {myPartners, dataset, location, stillLoading, onDelete, onPublish, isInvalidForm} = this.props;
const {myPartners, crops, dataset, location, stillLoading, onDelete, onPublish, isInvalidForm} = this.props;
return (
<NavigationWrapper location={ location } stillLoading={ stillLoading } disabledNext={ isInvalidForm }
......@@ -62,6 +66,7 @@ class BasicInfoStep extends React.Component<IDatasetProps, any> {
<BasicInfoForm
initialValues={ dataset }
partners={ myPartners }
crops={ crops }
/>
</NavigationWrapper>
);
......@@ -70,7 +75,9 @@ class BasicInfoStep extends React.Component<IDatasetProps, any> {
const mapStateToProps = (state, ownProps) => ({
dataset: state.datasets.dashboard.dataset,
crops: state.crop.list,
myPartners: state.partner.dashboard.myPartners,
crop: state.crop.list,
stillLoading: ownProps.stillLoading,
location: ownProps.location,
onDelete: ownProps.onDelete,
......@@ -81,6 +88,7 @@ const mapStateToProps = (state, ownProps) => ({
const mapDispatchToProps = (dispatch) => bindActionCreators({
loadMyPartners,
listCrops,
submit,
}, dispatch);
......
......@@ -7,11 +7,6 @@ import Button from '@material-ui/core/Button';
import Grid from '@material-ui/core/Grid';
import IconButton from '@material-ui/core/IconButton';
import DeleteIcon from '@material-ui/icons/Delete';
import Radio from '@material-ui/core/Radio';
import RadioGroup from '@material-ui/core/RadioGroup';
import FormControlLabel from '@material-ui/core/FormControlLabel';
import FormLabel from '@material-ui/core/FormLabel';
import FormControl from 'ui/common/forms/FormControl';
import Validators from 'utilities/Validators';
import {log} from 'utilities/debug';
......@@ -20,6 +15,7 @@ import {TextField} from 'ui/common/text-field';
import {DATASET_CREATOR_FORM} from 'datasets/constants';
import Dataset from 'model/catalog/Dataset';
import DatasetCreator, { CreatorRole} from 'model/catalog/DatasetCreator';
import RadioSelection from 'ui/common/forms/RadioSelection';
interface IDatasetCreatorFormProps extends React.ClassAttributes<any> {
t: any;
......@@ -42,25 +38,7 @@ const styles = (theme) => ({
}
});
/* tslint:enable */
const renderRadioGroup = translate()(({input, meta, t, classes}) => {
const onInputChange = (event, value) => input.onChange(value);
return (
<FormControl fullWidth required meta={ meta }>
<FormLabel>{ t('datasets.dashboard.p.stepper.creators.role') }</FormLabel>
<RadioGroup
{ ...input }
value={ input.value }
onChange={ onInputChange }
className={ classes.RadioGrid }
>
{ Object.keys(CreatorRole).map((role) => (
<FormControlLabel key={ role } value={ role } label={ t(`datasets.common.creator.role.${role}`) } control={ <Radio/> } />
)) }
</RadioGroup>
</FormControl>
);
});
class DatasetCreatorForm extends React.Component<IDatasetCreatorFormProps, any> {
......@@ -73,6 +51,16 @@ class DatasetCreatorForm extends React.Component<IDatasetCreatorFormProps, any>
this.props.deleteCreatorRequest(this.props.dataset.uuid, fields.get(index));
}
private renderRoleLabel = (role) => (
<div style={ {paddingTop: '6px', marginBottom: '-6px'} }>
<b style={ {fontSize: '14px'} }>{ this.props.t(`datasets.common.creator.role.${role}`) }</b>
<div>
<p style={ {whiteSpace: 'pre-line'} }>{ this.props.t(`datasets.common.creator.roledesc.${role}`) }</p>
</div>
</div>
)
public renderCreators = ({ classes, fields, meta: { touched, error, submitFailed } }) => {
const { t } = this.props;
......@@ -94,7 +82,11 @@ class DatasetCreatorForm extends React.Component<IDatasetCreatorFormProps, any>
/>
<Field required name={ `${creator}.role` }
classes={ classes }
component={ renderRadioGroup }
component={ RadioSelection }
options={ Object.keys(CreatorRole) }
formLabel={ t('datasets.dashboard.p.stepper.creators.role') }
renderOptionLabel={ this.renderRoleLabel }
singleColumn
/>
<Field name={ `${creator}.institutionalAffiliation` }
component={ TextField }
......
......@@ -9,12 +9,12 @@ import Authorize from 'ui/common/authorized/Authorize';
import SelectPartner from 'partners/ui/c/SelectPartner';
import Validators from 'utilities/Validators';
import remoteSubmit from 'descriptorlists/ui/descriptorlist-stepper/steps/basic-info/RemoteSubmit';
import CropSelector from 'crops/ui/c/CropSelector';
import RadioSelection from 'ui/common/forms/RadioSelection';
class DescriptorListForm extends React.Component<any, any> {
public render() {
const {error, handleSubmit, initialValues, partners, t} = this.props;
const {error, handleSubmit, initialValues, partners, crops, t} = this.props;
return (
<form onSubmit={ handleSubmit } className="p-20 m-20 even-row">
{ initialValues && initialValues.version && <div>Version: { initialValues.version }</div> }
......@@ -56,8 +56,10 @@ class DescriptorListForm extends React.Component<any, any> {
<Field name="crop"
label={ t('descriptorlists.public.common.crop') }
placeholder={ t('descriptorlists.public.c.form.maize') }
component={ CropSelector }
single
component={ RadioSelection }
options={ crops }
valueField="shortName"
renderOptionLabel={ (crop) => crop.name }
/>
<Field required
name="title"
......
......@@ -7,7 +7,9 @@ import DescriptorListForm from 'descriptorlists/ui/c/DescriptorListForm';
import {loadDescriptorList, saveDescriptorList} from 'descriptorlists/actions/editor';
import {loadMyPartners} from 'partners/actions/dashboard';
import { listCrops } from 'actions/crop';
import Partner from 'model/genesys/Partner';
import Crop from 'model/genesys/Crop';
import {submit, isInvalid} from 'redux-form';
import NavigationWrapper from 'ui/common/stepper/NavigationWrapper';
import {DESCRIPTORLIST_FORM} from 'descriptors/constants';
......@@ -19,6 +21,8 @@ interface IDescriptorListProps extends React.ClassAttributes<any> {
loadDescriptorList: any;
saveDescriptorList: any;
loadMyPartners: any;
listCrops: any;
crops: Crop[];
myPartners: Partner[];
stillLoading: boolean;
onDelete: () => void;
......@@ -36,10 +40,13 @@ class BasicInfoStep extends React.Component<IDescriptorListProps, any> {
];
public componentWillMount() {
const {myPartners, loadMyPartners} = this.props;
const {myPartners, loadMyPartners, crops, listCrops} = this.props;
if (! myPartners || myPartners.length === 0) {
loadMyPartners();
}
if (! crops || crops.length === 0) {
listCrops(true);
}
}
protected gotoStep = (id) => () => {
......@@ -49,7 +56,7 @@ class BasicInfoStep extends React.Component<IDescriptorListProps, any> {
}
public render() {
const {myPartners, stillLoading, onDelete, onPublish, isInvalidForm, location} = this.props;
const {myPartners, crops, stillLoading, onDelete, onPublish, isInvalidForm, location} = this.props;
let {descriptorList} = this.props;
if (! descriptorList) {
......@@ -63,6 +70,7 @@ class BasicInfoStep extends React.Component<IDescriptorListProps, any> {
<DescriptorListForm
initialValues={ descriptorList }
partners={ myPartners }
crops={ crops }
/>
</NavigationWrapper>
);
......@@ -71,6 +79,7 @@ class BasicInfoStep extends React.Component<IDescriptorListProps, any> {
const mapStateToProps = (state, ownProps) => ({
myPartners: state.partner.dashboard.myPartners,
crops: state.crop.list,
descriptorList: state.descriptorList.dashboard.descriptorList,
location: ownProps.location,
onDelete: ownProps.onDelete,
......@@ -82,6 +91,7 @@ const mapStateToProps = (state, ownProps) => ({
const mapDispatchToProps = (dispatch) => bindActionCreators({
saveDescriptorList,
loadMyPartners,
listCrops,
loadDescriptorList,
submit,
}, dispatch);
......
......@@ -9,6 +9,7 @@ import {DESCRIPTOR_FORM} from 'descriptors/constants';
import ItemsEditor from 'ui/common/ItemsEditor';
import VocabularyTerm from 'model/vocabulary/VocabularyTerm';
import Descriptor from 'model/catalog/Descriptor';
import Validators from 'utilities/Validators';
import { TextField } from 'ui/common/text-field';
......@@ -18,16 +19,12 @@ import SelectPartner from 'partners/ui/c/SelectPartner';
import SelectVocabulary from './SelectVocabulary';
import Button from '@material-ui/core/Button';
import Radio from '@material-ui/core/Radio';
import RadioGroup from '@material-ui/core/RadioGroup';
import { Toggle, FormControl } from 'ui/common/forms';
import FormLabel from '@material-ui/core/FormLabel';
import FormControlLabel from '@material-ui/core/FormControlLabel';
import { Toggle } from 'ui/common/forms';
import Grid from '@material-ui/core/Grid';
import { setPageTitle } from 'actions/pageTitle';
import { bindActionCreators } from 'redux';
import CropSelector from 'crops/ui/c/CropSelector';
import RadioSelection from 'ui/common/forms/RadioSelection';
import withStyles from '@material-ui/core/styles/withStyles';
/* tslint:disable */
......@@ -42,53 +39,6 @@ const styles = (theme) => ({
});
/* tslint:enable */
// FIXME Use Descriptor.DATATYPES
const renderDataTypeRadioGroup = ({input, meta, classes, t, ...rest}) => (
<FormControl required fullWidth>
<FormLabel>{ t(`descriptors.admin.c.form.dataType`) }</FormLabel>
<RadioGroup
{ ...input }
{ ...rest }
value={ input.value }
onChange={
(event, value) => input.onChange(value) // tslint:disable-line
}
className={ classes.RadioGrid }
>
<FormControlLabel value="TEXT" label={ t(`descriptors.common.dataType.text`) } control={ <Radio/> }/>
<FormControlLabel value="BOOLEAN" label={ t(`descriptors.common.dataType.boolean`) } control={ <Radio/> }/>
<FormControlLabel value="DATE" label={ t(`descriptors.common.dataType.date`) } control={ <Radio/> }/>
<FormControlLabel value="CODED" label={ t(`descriptors.common.dataType.coded`) } control={ <Radio/> }/>
<FormControlLabel value="NUMERIC" label={ t(`descriptors.common.dataType.numeric`) } control={ <Radio/> }/>
<FormControlLabel value="SCALE" label={ t(`descriptors.common.dataType.scale`) } control={ <Radio/> }/>
</RadioGroup>
</FormControl>
);
// FIXME Use Descriptor.CATEGORIES
const renderCategoryRadioGroup = ({input, meta, classes, t, ...rest}) => (
<FormControl required fullWidth>
<FormLabel>{ t(`descriptors.admin.c.form.descriptorCategory`) }</FormLabel>
<RadioGroup
{ ...input }
{ ...rest }
value={ input.value }
onChange={
(event, value) => input.onChange(value) // tslint:disable-line
}
className={ classes.RadioGrid }
>
<FormControlLabel value="PASSPORT" label={ t(`descriptors.common.category.passport`) } control={ <Radio/> }/>
<FormControlLabel value="MANAGEMENT" label={ t(`descriptors.common.category.management`) } control={ <Radio/> }/>
<FormControlLabel value="ENVIRONMENT" label={ t(`descriptors.common.category.environment`) } control={ <Radio/> }/>
<FormControlLabel value="CHARACTERIZATION" label={ t(`descriptors.common.category.characterization`) } control={ <Radio/> }/>
<FormControlLabel value="EVALUATION" label={ t(`descriptors.common.category.evaluation`) } control={ <Radio/> }/>
<FormControlLabel value="ABIOTICSTRESS" label={ t(`descriptors.common.category.abioticstress`) } control={ <Radio/> }/>
<FormControlLabel value="BIOTICSTRESS" label={ t(`descriptors.common.category.bioticstress`) } control={ <Radio/> }/>
<FormControlLabel value="MOLECULAR" label={ t(`descriptors.common.category.molecular`) } control={ <Radio/> }/>
</RadioGroup>
</FormControl>
);
class DescriptorForm extends React.Component<any, any> {
......@@ -124,7 +74,7 @@ class DescriptorForm extends React.Component<any, any> {
}
public render() {
const {error, handleSubmit, initialValues, pageTitle, onPublish, invalid, submitting, anyTouched, currentOwner, currentVocabulary, classes, t} = this.props;
const {crops, error, handleSubmit, initialValues, pageTitle, onPublish, invalid, submitting, anyTouched, currentOwner, currentVocabulary, classes, t} = this.props;
if (! initialValues) {
return null;
......@@ -167,8 +117,10 @@ class DescriptorForm extends React.Component<any, any> {
/>
<Field name="crop"
label={ t(`descriptors.admin.c.form.crop`) }
component={ CropSelector }
single
component={ RadioSelection }
options={ crops }
valueField="shortName"
renderOptionLabel={ (crop) => crop.name }
/>
<Field required name="title"
label={ t(`descriptors.admin.c.form.descriptorTitle`) }
......@@ -196,7 +148,9 @@ class DescriptorForm extends React.Component<any, any> {
/>
<Field required name="category"
classes={ classes }
component={ renderCategoryRadioGroup }
component={ RadioSelection }
options={ Object.getOwnPropertyNames(Descriptor.CATEGORIES) }
renderOptionLabel={ (option) => t(Descriptor.CATEGORIES[option]) }
t={ t }
validate={ [ Validators.required ] }
/>
......@@ -216,7 +170,9 @@ class DescriptorForm extends React.Component<any, any> {
/>
<Field required name="dataType"
classes={ classes }
component={ renderDataTypeRadioGroup }
component={ RadioSelection }
options={ Object.getOwnPropertyNames(Descriptor.DATATYPES) }
renderOptionLabel={ (option) => t(Descriptor.DATATYPES[option]) }
t={ t }
validate={ [ Validators.required ] }
/>
......@@ -271,6 +227,7 @@ class DescriptorForm extends React.Component<any, any> {
const selector = formValueSelector(DESCRIPTOR_FORM);
const mapStateToProps = (state, ownProps) => ({
crops: state.crop.list,
dataType: selector(state, 'dataType'),
currentTerms: selector(state, 'terms'),
currentOwner: selector(state, 'owner'),
......
......@@ -54,12 +54,12 @@ export default class Descriptor implements IUserPermissions {
};
public static DATATYPES: { [key: string]: any; } = {
TEXT: 'descriptors.common.category.TEXT',
BOOLEAN: 'Yes/No',
DATE: 'Date',
CODED: 'Controlled vocabulary',
NUMERIC: 'Numeric',
SCALE: 'Scale',
TEXT: 'descriptors.common.dataType.text',
BOOLEAN: 'descriptors.common.dataType.boolean',
DATE: 'descriptors.common.dataType.date',
CODED: 'descriptors.common.dataType.coded',
NUMERIC: 'descriptors.common.dataType.numeric',
SCALE: 'descriptors.common.dataType.scale',
};
public static CATEGORIES: { [key: string]: any; } = {
......
import * as React from 'react';
import { translate } from 'react-i18next';
import FormControlLabel from '@material-ui/core/FormControlLabel';
import FormLabel from '@material-ui/core/FormLabel';
import FormControl from '@material-ui/core/FormControl';
import RadioGroup from '@material-ui/core/RadioGroup';
import { withStyles } from '@material-ui/core/styles';
import Checkbox from '@material-ui/core/Checkbox';
/* tslint:disable */
const styles = (theme) =>({
radioGroupMultiColumn: {
flexDirection: 'row' as 'row',
justifyContent: 'space-between' as 'space-between',
'& > label': {
flexBasis: '12%',
[theme.breakpoints.down('lg')]: {
flexBasis: '24%',
},
[theme.breakpoints.down('md')]: {
flexBasis: '32%',
},
[theme.breakpoints.down('sm')]: {
flexBasis: '45%',
},
[theme.breakpoints.down('xs')]: {
flexBasis: '100%',
},
},
},
});
/* tslint:enable */
const handleCheckboxChange = (fields, code) => {
const index = fields.getAll() ? fields.getAll().indexOf(code) : -1;
if (index === -1) {
fields.push(code);
} else {
fields.remove(index);
}
};
const CheckboxSelection = ({formLabel, singleColumn = false, options, renderOptionLabel, valueField, fields, input, meta, classes, t, ...rest}) => (
<FormControl required className={ classes.root } fullWidth>
<FormLabel className={ classes.formLabel }>{ formLabel }</FormLabel>
<RadioGroup
{ ...input }
{ ...rest }
className={ singleColumn ? classes.radioGroupSingleColumn : classes.radioGroupMultiColumn }
>
{ options && options.length