  import React from 'react';
  import { FormControlLabel, Checkbox, FormHelperText } from '@mui/material';
  import PropTypes from "prop-types";

  function CheckboxInput({ field, disabled, onChange }) {
    return (
      <>
        <FormControlLabel
          className='input-checkbox'
          control={
            <Checkbox
              checked={field.ProValue == "true"}
              onChange={(e) => onChange(e.target.checked)}
              name={field.ProKey}
              disabled={disabled}
            />
          }
          label={field.Label}
        />
        {field.Error && (
          <FormHelperText error>{field.Error}</FormHelperText>
        )}
      </>
    );
  }

  export default CheckboxInput;

  CheckboxInput.propTypes = {
    field: PropTypes.shape({
      ProValue: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
      Label: PropTypes.string.isRequired,
      ProKey: PropTypes.string.isRequired,
      Error: PropTypes.string, 
    }).isRequired,
    disabled: PropTypes.bool,
    onChange: PropTypes.func.isRequired,
  };
