import React, { Component } from 'react';
import { Button, Checkbox, Form, Container, Grid, Header, Icon } from 'semantic-ui-react';
import { connect } from 'react-redux';
import { toggleSignupLink } from '../../actions';
import CustomerSignup from '../Signup/CustomerSignup';
import ProSignup from '../Signup/ProSignup';

class Signup extends Component {
  constructor() {
    super()
    this.findActiveLink = this.findActiveLink.bind(this)
  }

  findActiveLink(link) {
    return this.props.activeLink === link ? 'active' : '';
  }

  render() {
    const { dispatch } = this.props;
    const { activeLink: link } = this.props;
    return (
      <div>
        <Grid centered>
          <div className="signup-buttons">
            <Button.Group size='large'>
              <Button
                onClick={()=>dispatch(toggleSignupLink('customer'))}
                className={this.findActiveLink('customer')}
              >
                Customer
              </Button>
              <Button.Or />
              <Button
                onClick={()=>dispatch(toggleSignupLink('professional'))}
                className={this.findActiveLink('professional')}
              >
                Professional
              </Button>
            </Button.Group>
          </div>
        </Grid>
        { link === undefined ? null : link === 'professional' ? <ProSignup /> : <CustomerSignup /> }
      </div>
    )
  }
}

const mapStateToProps = (state) => {
  return {
    activeLink: state.auth.signupForm.activeLink
  }
}
export default connect(mapStateToProps)(Signup)

@@ -555,24 +555,32 @@
 const %7B 
-dispatch
+toggleSignupLink
  %7D = thi
@@ -812,33 +812,24 @@
 nClick=%7B()=%3E
-dispatch(
 toggleSignup
@@ -844,17 +844,16 @@
 stomer')
-)
 %7D%0A      
@@ -1054,17 +1054,8 @@
 ()=%3E
-dispatch(
 togg
@@ -1082,17 +1082,16 @@
 sional')
-)
 %7D%0A      
@@ -1291,37 +1291,8 @@
    %7B
- link === undefined ? null : 
 link
@@ -1479,16 +1479,141 @@
 k%0A  %7D%0A%7D%0A
+%0Aconst mapDispatchToProps = (dispatch) =%3E %7B%0A  return %7B%0A    toggleSignupLink: link =%3E dispatch(toggleSignupLink(link))%0A  %7D%0A%7D%0A%0A
 export d
@@ -1642,16 +1642,36 @@
 eToProps
+, mapDispatchToProps
 )(Signup

Refactor Signup