add agree checkbox

src/routes/selfRegister/components/SignUp.js

@@ -17,6 +17,8 @@ import Toggle from 'material-ui/Toggle';
 import Snackbar from 'material-ui/Snackbar';
 import Instance from '../../../components/Connection';
 
+import Checkbox from 'material-ui/Checkbox';
+
 import ValidationErrorsInfoDialog from '../../../components/Shared/ValidationErrorsInfoDialog';
 
 class SignUp extends React.Component {
@@ -41,7 +43,8 @@ class SignUp extends React.Component {
       "passConfirmation": "",
       "organizationType": { name: "", key: "provider", desc: "" },
       showValidationErrors: false,
-      validationErrors: []
+      validationErrors: [],
+      agreedTerms:false,
     }
 
     this.buttonValidated = this.buttonValidated.bind(this);
@@ -67,7 +70,7 @@ class SignUp extends React.Component {
     if (!this.state.first || this.state.first === null || this.state.first === "") validated = false;
     if (!this.state.last || this.state.last === null || this.state.last === "") validated = false;
     if (!this.state.password_validated || !this.state.pass || this.state.pass === null || this.state.pass === "") validated = false;
-
+    if (!this.state.agreedTerms) validated = false;
     this.setState(Object.assign(this.state, { validated: validated }));
   }
 
@@ -111,6 +114,11 @@ class SignUp extends React.Component {
     this.setState(Object.assign(this.state, { password_validated: this.state.pass === this.state.passConfirmation }));
   };
 
+  handleChecked = (event, checked) => {
+    this.setState(Object.assign(this.state, { agreedTerms: checked }));
+    this.buttonValidated();
+  };
+
   clickEvent = (event) => {
     event.preventDefault();
     const state = this;
@@ -228,6 +236,14 @@ class SignUp extends React.Component {
                   />
                 </div>
                 <div className="divider" />
+                <div className="form-group">
+                  <Checkbox
+                    label="Member has consented to terms of use"
+                    checked={this.state.agreedTerms}
+                    onCheck={this.handleChecked}
+                  />
+                </div>
+                <div className="divider" />
                 <div className="form-group">
                   <p className="text-small">By clicking on sign up, you agree to <a href="javascript:;"><i>terms</i></a> and <a href="javascript:;"><i>privacy policy</i></a></p>
                 </div>