Adding some more controls & other clean-up

website/src/Validated/ValidatedCheckbox.js

@@ -1,13 +1,13 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { Form, Popup, Checkbox } from 'semantic-ui-react'
+import { Form } from 'semantic-ui-react'
+import { Checkbox } from '../ui'
 
 // This is an example of a validated component with a value that can change itself, that cannot ever be invalid.
 
 export class ValidatedCheckbox extends React.Component {
   static propTypes = {
     name: PropTypes.string.isRequired,
-    message: PropTypes.string.isRequired,
     label: PropTypes.string,
     width: PropTypes.number,
     validator: PropTypes.object.isRequired,
@@ -39,9 +39,7 @@ export class ValidatedCheckbox extends React.Component {
   render() {
     return (
       <Form.Field width={this.props.width} disabled={this.state.disabled} className={this.props.className}>
-        <Popup content={this.props.message} position='bottom center' hoverable trigger={
-          <Checkbox checked={!!this.state.value} name={this.props.name} label={this.props.label}
-            onChange={this.handleChange} />} />
+        <Checkbox value={!!this.state.value} name={this.props.name} label={this.props.label} />
       </Form.Field>
     )
   }