import React from 'react';
import { withNamespaces } from 'react-i18next';
import { FormGroup, FormControlLabel, Checkbox, FormLabel } from '@material-ui/core';
import translateLabel from "../translation";

function CheckboxLabels(props) {
  const [state, setState] = React.useState({
    checkedAcknowldege: false,
  });

  const handleChange = event => {
    setState({ ...state, [event.target.name]: event.target.checked });
    props.onAcknowledgeClick(event.target.checked);
  };

  return (
   <FormGroup row>
      <FormLabel component="legend" className="acknowledgelabel Acklabel">{translateLabel('ACKNOWLEDGE')} </FormLabel>
      <FormControlLabel style={{marginRight:"0px"}} control={<Checkbox checked={state.checkedAcknowldege} onChange={handleChange} name="checkedAcknowldege" style={{paddingRight:"0px"}} color="primary"/>}label={translateLabel('ACKNOWLEDGELABE')}/>
      {/* <TextareaAutosize className="textarea" aria-label="minimum height" rowsMin={5} placeholder={translateLabel('ADDITIONALNOTE')}/>  */}
    </FormGroup>
  );
}

export default withNamespaces()(CheckboxLabels);