content: import React, { Component } from 'react';
  import { connect } from 'react-redux';
  import { gql, graphql, compose } from 'react-apollo';
  import { Header } from 'semantic-ui-react';
  import { GC_LOGIN } from '../../../constants/constants';
  
  import './RegistrationPage.css';
  
  import Registration from '../components/Registration';
  import { init } from '../RegistrationActions';
  
  class RegistrationPage extends Component {
    constructor(props) {
      super(props);
      this.state = {
        error: false,
        success: false
      }
    }
    componentDidMount() {
      this.props.dispatch(init());
    }
    handleSubmit = async ({name, email, password}) => {
      //thisp.props.dispatch(formSubmit())
      this.setState({success: false, error: false, message: ''});
      const result = await this.props.createUserMutation({
        variables: {
          name,
          email,
          password
        }
      });
      this.setState({success: true});
      this.props.dispatch({type: GC_LOGIN, token: result.data.signinUser.data.token, user: result.data.signinUser.data.user});
    }
    render() {
      return (
        <div className="form_registration">
            <div>
              <Header size='large'>Регистрация</Header>
              <Registration success={this.state.success} onSubmit={this.handleSubmit} />
            </div>
        </div>
      );
    }
  }
  
  const CREATE_USER_MUTATION = gql`
  mutation CreateUserMutation($name: String!, $email: String!, $password: String!) {
    createUser(
      name: $name,
      authProvider: {
        email: {
          email: $email,
          password: $password
        }
      }
    ) {
      id
    }
  
    signinUser(email: {
      email: $email,
      password: $password
    }) {
      message
      status
      data {
        token
        user {
          id
          name
        }
      }
    }
  }
  `
  
  export default compose(
    connect(dispatch => ({dispatch})),
    graphql(CREATE_USER_MUTATION, { name: 'createUserMutation' })
  )(RegistrationPage);
  