select * from users 
join groups using (user_id)

select * from users u join 
groups g on (g.groups_user_id=u.users_user_id)

  // handling the confirmation registration after entering the verification code
  hadleConfirmRegistration = async (verificationCode) => {
        const {location} = this.props;
        const {state} = location;
        const {registerVerify} = state;
        const {password,email} = registerVerify;
        // const crmIdVal =  myAccountService.getCrmId();
        this.setState({emailVal:email,passwordVal:password,crmId:crmIdVal});
    try {
            await Auth.confirmSignUp(this.state.emailVal, verificationCode);
            const user = await Auth.signIn(this.state.emailVal, this.state.passwordVal);
            console.log(user, 'user');
            this.props.history.push({pathname: crmIdVal ? '/verifyduplicate':'/dashboard', state: { email: this.state.emailVal}})
    } 
    catch (e) {
        console.log(e);
    }  
}

class Toggle extends React.Component {
  constructor(props) {
    super(props);
    this.state = {isToggleOn: true};

    // This binding is necessary to make `this` work in the callback
    this.handleClick = this.handleClick.bind(this);
  }

  handleClick() {
    this.setState(state => ({
      isToggleOn: !state.isToggleOn
    }));
  }

  render() {
    return (
      <button onClick={this.handleClick}>
        {this.state.isToggleOn ? 'ON' : 'OFF'}
      </button>
    );
  }
}

ReactDOM.render(
  <Toggle />,
  document.getElementById('root')
);

 renderFileUpload() {
131     if (this.state.showFileUpload) {
132       return (
133         <div>
134         <font color='white'>Upload new pic</font><br />
135       <input type="file" onChange={this.handleFileChange}/>
136       <button onClick={this.handleUpload}>Upload</button>
137         </div>
138       );
139     }
140   }

handleUpload = () => {
 46
 47     if (!this.state.selectedFile) {
 48       this.setState( { warning : 'No file selected' } );
 49       return;
 50     } else {
 51       this.setState( { warning : null } );
 52     }
 53     const fd = new FormData();
 54     fd.append('file', this.state.selectedFile, this.state.selectedFile.name)    ;
 55     fd.append('caption', this.state.caption);
 56     fetch( this.props.DATA_URI + '/upload_image', {
 57       method: 'POST',
 58       headers: {
 59         'Accept': 'application/json',
 60       },
 61       credentials : 'same-origin',
 62       body: fd
 63     })
 64     .then((response) => response.json())
 65     .then((data) => {
 66       this.setState( {
 70         showFileUpload : false,
 71         showCaption : true,
 72         showPreview: true,
 73         imageId : data.image_id,
 74         imagePath : data.imagePath,
 75       } );
 76     })
 77     .catch((error) => {
 78       this.setState( { warning : 'There was a problem uploading the file' }    );
 79     });
 80   }

  handleSignup = async (event) => {
    event.preventDefault();
    const data = new FormData(event.target);

    const signupData = {
      username: data.get('email'),
      password: data.get('password'),
      changePassword: data.get('confirmPassword'),
    };

    if (!this.validateForm(signupData)) {
      this.setState({pwdError:true});
      return;
    }
   
   ... do your other stuff here ...

  }

            
<form onSubmit={this.handleSignup}>
  <div className="registration">
    <div>
      <label>Email Address / Phone Number</label>
      <input type="text" name="email"/>
    </div>
    <div>
      <label>Create Password</label>
      <input type="password" name="password"/>
    </div>
    <div className="reg-Confirm-password">
      <label>Confirm Password</label>
      <input type="password" name="confirmPassword"/>
    </div>
      {this.state.pwdError && 
    <div className="reg-password-error">
      <strong className='pwd-err-msg'>Please Enter Correct Password</strong>
    </div> }
    <div>
      <button type="submit">CONTINUE</button>
    </div>
  </div>
</form>